Home>Support>I need the body of my page to be as wide as the screen.

I need the body of my page to be as wide as the screen.

By forevr2wheels, 9 years ago. Last reply by Magus, 9 years ago.

Hi !
One issue i need help with, if you look at this site
The 4 rows below the slider don’t stretch to the width of the of the screen like the slider does.
Seems like anything in the body stops at 1080p. Let me know if it could be done and how. Thanks

URL: http://msgulfcoastpaddle.com/

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 9 years, 4 months ago Magus
    Hi, I Work Here

    Hi Forevr2wheels

    Please go to the page editor and click on the spanner icon on the row you want full width.
    Under the Layout option set the Row Layout to Full Width Stretched.

    This will overrule the 1080px boundary for the main container.

    Let us know how you get on

    Magus

  2. 9 years, 4 months ago forevr2wheels

    Thanks for your help. Feel stupid because i was looking everywhere but there. One more question though.
    How can i reduce the border of those rows that the pictures will be shoulder to shoulder without that 5% frame ?
    Thanks in advance

  3. 9 years, 4 months ago Magus
    Hi, I Work Here

    Hi Forevr2wheels

    Edit the row again and expand the attributes section. Set the Row Class to ‘depadme’ without the quotes. Click done and save the page.
    Navigate to Appearance->Custom CSS and add the following

    .depadme .panel-grid-cell {
      padding-left:0;
      padding-right:0;
    }
    

    Let us know how you get on

    Magus

  4. 9 years, 4 months ago forevr2wheels

    Did everything as you advised. Nothing changed.. The rows still have the same padding.

  5. 9 years, 4 months ago Magus
    Hi, I Work Here

    Hi Forevr2wheels

    The settings are being overridden. Please change the CSS to

    .depadme .panel-grid-cell {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }
    

    Magus

  6. 9 years, 4 months ago forevr2wheels

    You’re the man. I tried to play around with padding-top: 0px !important; to take out the gap between the slider and the row but no luck. I guess that is the padding on the bottom of the slider ?! How do i fix that ? Thanks

  7. 9 years, 4 months ago Magus
    Hi, I Work Here

    Hi Forevr2wheels

    To remove the padding try this

    #main {
    padding-top: 0px !important;
    }
    

    This will remove the padding on all pages. If you only need to do this on the home page change it to this

    .home #main {
    padding-top: 0px !important;
    }
    

    Magus

  8. 9 years, 4 months ago forevr2wheels

    Perfect Thanks !

  9. 9 years, 4 months ago Magus
    Hi, I Work Here

    No Problem

    If you need any more help please feel free to open a new support thread.

    Magus

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More