Title: Padding: Modifying Page Width While Keeping Full-Width Header
Last modified: September 1, 2016

---

# Padding: Modifying Page Width While Keeping Full-Width Header

 *  [Webtagion](https://wordpress.org/support/users/webtagion/)
 * (@webtagion)
 * [9 years, 9 months ago](https://wordpress.org/support/topic/padding-modifying-page-width-while-keeping-full-width-header/)
 * I’m trying to make my homepage look somewhat like [http://www.hammerandtusk.com/newsletter/page/1](http://www.hammerandtusk.com/newsletter/page/1).
   This means adding margins on the left and right, and modifying the width of the
   center divider or margin between the two columns of content. My site is someweekendreading.
   com.
 * 1. What tweaks do I have to make in the following CSS to keep the header full
   width and just apply the left and right padding changes to the body of the page?
 * I’ve used:
    ‘.contentclass {
padding-left: 20px;}
.contentclass {
padding-right:
   20px;}’ It works but obviously adds padding to the entire vertical of the page.
 * 2. What is the CSS to add padding (increase the separation) in the middle between
   the two columns?
 * Thank you very much for the assistance.

Viewing 8 replies - 1 through 8 (of 8 total)

 *  [Kevin](https://wordpress.org/support/users/jx-3p/)
 * (@jx-3p)
 * [9 years, 9 months ago](https://wordpress.org/support/topic/padding-modifying-page-width-while-keeping-full-width-header/#post-7715692)
 * Hello,
 * Try adding this CSS to Appearance> Theme Options> Custom CSS and let me know 
   if this is what you’re looking for:
 *     ```
       body.home #content .main {
           max-width: 940px;
           margin-right: auto;
           margin-left: auto;
       }
   
       .home_blog .kad_blog_item {
           padding: 0 30px;
       }
       ```
   
 * Let me know if this works for you.
 * Thanks,
    Kevin
 *  [Ben Ritner – Kadence WP](https://wordpress.org/support/users/britner/)
 * (@britner)
 * [9 years, 9 months ago](https://wordpress.org/support/topic/padding-modifying-page-width-while-keeping-full-width-header/#post-7715693)
 * 1.
 *     ```
       @media (min-width: 992px){
       #content {
           width: 800px;
       }
       }
       ```
   
 * 2. How much are you wanting to add? The space there is already similar to your
   example link?
 * Kadence Themes
 *  Thread Starter [Webtagion](https://wordpress.org/support/users/webtagion/)
 * (@webtagion)
 * [9 years, 9 months ago](https://wordpress.org/support/topic/padding-modifying-page-width-while-keeping-full-width-header/#post-7715703)
 * Awesome support. Thank you.
 * 1. The first CSS suggestion worked perfectly.
 * 2. I can live with the current spacing but was curious about what the CSS is 
   so I can play around with the spacing.
 *  [Kevin](https://wordpress.org/support/users/jx-3p/)
 * (@jx-3p)
 * [9 years, 9 months ago](https://wordpress.org/support/topic/padding-modifying-page-width-while-keeping-full-width-header/#post-7715819)
 * The CSS I posted:
 *     ```
       .home_blog .kad_blog_item {
           padding: 0 30px;
       }
       ```
   
 * should allow you to adjust the padding of your home blog items. You can change
   the values if you want to see different padding settings.
 * -Kevin
 *  Thread Starter [Webtagion](https://wordpress.org/support/users/webtagion/)
 * (@webtagion)
 * [9 years, 9 months ago](https://wordpress.org/support/topic/padding-modifying-page-width-while-keeping-full-width-header/#post-7715828)
 * Works great thank you.
 * What would be the change to tweak the code for my archives page, which is someweekendreading.
   com/archive?
 *  Thread Starter [Webtagion](https://wordpress.org/support/users/webtagion/)
 * (@webtagion)
 * [9 years, 9 months ago](https://wordpress.org/support/topic/padding-modifying-page-width-while-keeping-full-width-header/#post-7715829)
 * Post Script: I’ve decided to test two different home page layouts:
 * 1. One with the two columns as described above.
 * 2. The other would only have a single column to display the entirety of the current
   issue. In this case, the issue is how to limit “Latest Post Displays” to one 
   post rather than two. I’ve created a separate question for this issue because
   I think others may encounter the same issue.
 *  Thread Starter [Webtagion](https://wordpress.org/support/users/webtagion/)
 * (@webtagion)
 * [9 years, 9 months ago](https://wordpress.org/support/topic/padding-modifying-page-width-while-keeping-full-width-header/#post-7715830)
 * Support thread to resolve question 2 above:
 * [https://wordpress.org/support/topic/limit-latest-post-displays-to-one-post-rather-than-two?replies=1#post-8823590](https://wordpress.org/support/topic/limit-latest-post-displays-to-one-post-rather-than-two?replies=1#post-8823590)
 *  [Ben Ritner – Kadence WP](https://wordpress.org/support/users/britner/)
 * (@britner)
 * [9 years, 8 months ago](https://wordpress.org/support/topic/padding-modifying-page-width-while-keeping-full-width-header/#post-7721238)
 * Hey,
    You would do this differently. You would need to go to settings > reading.
   And there set the front page as your latest post page.
 * Then in your theme options > home layout you would move “latest posts” to disabled.
 * And move “page content” to enabled. Then your posts would show as a single column
   layout.
 * Ben
    Kadence Themes

Viewing 8 replies - 1 through 8 (of 8 total)

The topic ‘Padding: Modifying Page Width While Keeping Full-Width Header’ is closed
to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/pinnacle/1.8.10/screenshot.png)
 * Pinnacle
 * [Support Threads](https://wordpress.org/support/theme/pinnacle/)
 * [Active Topics](https://wordpress.org/support/theme/pinnacle/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/pinnacle/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/pinnacle/reviews/)

## Tags

 * [full width header](https://wordpress.org/support/topic-tag/full-width-header/)
 * [padding](https://wordpress.org/support/topic-tag/padding/)
 * [page width](https://wordpress.org/support/topic-tag/page-width/)

 * 8 replies
 * 3 participants
 * Last reply from: [Ben Ritner – Kadence WP](https://wordpress.org/support/users/britner/)
 * Last activity: [9 years, 8 months ago](https://wordpress.org/support/topic/padding-modifying-page-width-while-keeping-full-width-header/#post-7721238)
 * Status: not resolved