Title: Longevity Page Width
Last modified: March 6, 2017

---

# Longevity Page Width

 *  Resolved [chiaraparodi78](https://wordpress.org/support/users/chiaraparodi78/)
 * (@chiaraparodi78)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/longevity-page-width/)
 * Hi there,
    is it possible to make the width box a bit smaller? I would like to
   open the website and be able to see that there are articles under the header.
   Boxed 1200 is not small enough. Thanks Chiara

Viewing 15 replies - 1 through 15 (of 17 total)

1 [2](https://wordpress.org/support/topic/longevity-page-width/page/2/?output_format=md)
[→](https://wordpress.org/support/topic/longevity-page-width/page/2/?output_format=md)

 *  Thread Starter [chiaraparodi78](https://wordpress.org/support/users/chiaraparodi78/)
 * (@chiaraparodi78)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/longevity-page-width/#post-8879436)
 * If it is not clear what I’m asking, you can have a look at
    [http://www.viaggiatricedichiarata.com](http://www.viaggiatricedichiarata.com)
   This is how I’d like to see it, but with the Longevity theme.
 *  Theme Author [Shaped Pixels](https://wordpress.org/support/users/shaped-pixels/)
 * (@shaped-pixels)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/longevity-page-width/#post-8880553)
 * Just the content area only or the whole thing from top to bottom, including the
   header area and footer?
 *  Thread Starter [chiaraparodi78](https://wordpress.org/support/users/chiaraparodi78/)
 * (@chiaraparodi78)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/longevity-page-width/#post-8880647)
 * Thanks your reply.
    I want to reduce the space Just from the menu to the articles.
   Is it possible? Thanks
 *  Theme Author [Shaped Pixels](https://wordpress.org/support/users/shaped-pixels/)
 * (@shaped-pixels)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/longevity-page-width/#post-8880844)
 * The space between the menu and the articles is a bit dofferent from what you 
   wrere referring to previously. But let’s start with the “boxed” question first.
   This theme uses the Bootstrap grid layout, so it has a set value of widths depending
   on various screen sizes. The smallest is 1200 on desktop monitors. If you want
   a boxed layout but you also need to reduce the main structure, you’ve got some
   custom CSS to do.
 * By default, the theme has this:
 *     ```
       @media (min-width: 1200px) {
       .container {
           width: 1190px;
       }
       }
       @media (min-width: 992px) {
       .container {
           width: 990px;
       }
       }
       @media (min-width: 768px) {
       .container {
           width: 750px;
       }
       }
       ```
   
 * Those are media queries that changes the main containers to those sizes based
   on the screen size the site is viewed in.
 * The above is also for a full width page, not boxed. But if you want to change
   the boxed to be smaller, then you need to modify the class that does the boxed
   1200 size.
 *     ```
       #page.boxed1200 {
       	max-width: 1200px;
       	margin: 24px auto;
       }
       ```
   
 * You will need to override the 1200px to be your size you want. Make sure it’s
   not smaller than the first media query further up where it has the min-width 
   of 1200px. So whatever you make that one, such as 1000px, then your boxed1200
   style needs to be no less than 1000px as well.
 * **IMPORTANT**: either use the Additional CSS tab in the customizer for this or
   a plugin like Simple Custom CSS. Do not edit the theme’s style.css file.
 *  Thread Starter [chiaraparodi78](https://wordpress.org/support/users/chiaraparodi78/)
 * (@chiaraparodi78)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/longevity-page-width/#post-8884688)
 * I’ve done copy and paste of this one into the additional css:
    #page.boxed1200{
   max-width: 1200px; margin: 24px auto; }
 * I’ve changed the numbers to 1000 but nothing has changed.
    What am I doing wrong?
 *  Theme Author [Shaped Pixels](https://wordpress.org/support/users/shaped-pixels/)
 * (@shaped-pixels)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/longevity-page-width/#post-8893471)
 * only change the number in the max-width line, so in your case it would look like:
 *     ```
       #page.boxed1200 {
       max-width: 1000px;
       margin: 24px auto;
       }
       ```
   
 *  Thread Starter [chiaraparodi78](https://wordpress.org/support/users/chiaraparodi78/)
 * (@chiaraparodi78)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/longevity-page-width/#post-8893557)
 * Hi, it doesn’t work.
    I would like to attach a screenshot before and after but
   I don’t know how to do it here. The box becomes smaller from right to left, and
   things in the box, like menu and header are left outside. I would like to reduce
   the space between the menu, under the header picture, and the articles. Reducing
   the box size doesn’t change Sorry, is a bit difficult for me to explain things
   I have never seen before
 *  Theme Author [Shaped Pixels](https://wordpress.org/support/users/shaped-pixels/)
 * (@shaped-pixels)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/longevity-page-width/#post-8893649)
 * can you post your actual website URL please
    A screenshot would also help, maybe
   try uploading it somewhere else and provide me a link to it
 *  Thread Starter [chiaraparodi78](https://wordpress.org/support/users/chiaraparodi78/)
 * (@chiaraparodi78)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/longevity-page-width/#post-8893787)
 * See if you can see this one:
    [http://209.e7a.myftpupload.com/](http://209.e7a.myftpupload.com/)
 *  Thread Starter [chiaraparodi78](https://wordpress.org/support/users/chiaraparodi78/)
 * (@chiaraparodi78)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/longevity-page-width/#post-8893801)
 * This is with the theme I want to change:
    [http://www.viaggiatricedichiarata.com/](http://www.viaggiatricedichiarata.com/)
 * I love the Longevity, but I need to make the picture and menu closer to the articles,
   like in Voyage
 *  Theme Author [Shaped Pixels](https://wordpress.org/support/users/shaped-pixels/)
 * (@shaped-pixels)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/longevity-page-width/#post-8893858)
 * thanks, I can see the site now.
 * Try adding this to your custom CSS as well and see if that sorts things out:
 *     ```
       @media (min-width: 1200px)
       .container {
           width: 1000px;
       }
       ```
   
 *  Thread Starter [chiaraparodi78](https://wordpress.org/support/users/chiaraparodi78/)
 * (@chiaraparodi78)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/longevity-page-width/#post-8893888)
 * Nothing has changed, I’ve tried with both togetherand this one alone
 *  Theme Author [Shaped Pixels](https://wordpress.org/support/users/shaped-pixels/)
 * (@shaped-pixels)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/longevity-page-width/#post-8894004)
 * Okay, I see where was the issue. Remove what you added so far and just add this
   all together and it will work:
 *     ```
       @media (min-width: 1200px) {
       body .container {
           width: 1000px;
       }
       }
       #page.boxed1200 {
           max-width: 1000px;
           margin: 24px auto;
       }
       ```
   
 *  Thread Starter [chiaraparodi78](https://wordpress.org/support/users/chiaraparodi78/)
 * (@chiaraparodi78)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/longevity-page-width/#post-8894029)
 * Hes, done.
    [http://209.e7a.myftpupload.com/](http://209.e7a.myftpupload.com/)
 * Just still too much space between menu and articles, can we fix that too?
    Thanks,
   you’re being very helpful
 *  Theme Author [Shaped Pixels](https://wordpress.org/support/users/shaped-pixels/)
 * (@shaped-pixels)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/longevity-page-width/#post-8894075)
 * I’m glad it works.
    Add this as well to tighten up the space on the top
 *     ```
       @media (min-width: 992px) {
       #no-banner {
           height: 25px;
       }
       }
       body #content {
           padding: 30px 0 60px 0;
       }
       ```
   

Viewing 15 replies - 1 through 15 (of 17 total)

1 [2](https://wordpress.org/support/topic/longevity-page-width/page/2/?output_format=md)
[→](https://wordpress.org/support/topic/longevity-page-width/page/2/?output_format=md)

The topic ‘Longevity Page Width’ is closed to new replies.

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

## Tags

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

 * 17 replies
 * 2 participants
 * Last reply from: [Shaped Pixels](https://wordpress.org/support/users/shaped-pixels/)
 * Last activity: [9 years, 2 months ago](https://wordpress.org/support/topic/longevity-page-width/page/2/#post-8894244)
 * Status: resolved