This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

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

10 years ago · Last reply by Magus 10 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.

Need fast email support? Get SiteOrigin Premium

Replies

9
  1. Magus Staff 10 years, 9 months ago

    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. forevr2wheels 10 years, 9 months ago

    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. Magus Staff 10 years, 9 months ago

    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. forevr2wheels 10 years, 9 months ago

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

  5. Magus Staff 10 years, 9 months ago

    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. forevr2wheels 10 years, 9 months ago

    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. Magus Staff 10 years, 9 months ago

    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. forevr2wheels 10 years, 9 months ago

    Perfect Thanks !

  9. Magus Staff 10 years, 9 months ago

    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.

Have a different question or issue?

Start New Thread