Title: Make Slider full width
Last modified: August 30, 2016

---

# Make Slider full width

 *  [Alex GR](https://wordpress.org/support/users/alex-gr/)
 * (@alex-gr)
 * [10 years, 5 months ago](https://wordpress.org/support/topic/make-slider-full-width/)
 * Halo again,
 * After finally having the site public,I ‘d like to indicate following Problem.
 * I use Crelly Slider inside a Siteorigin Editor Row with Full width Layout.
    Although
   the Home Page Slider is Full width the margins remain. Maybe its wrapped inside
   a div? Applying the same styling in the Row with a picture umderneath was successful.
 * Ideally, I want the white spaces around the Slider to disappear.
    Thank you in
   advance for ..any Idea.
 * [http://cartesiuscoffee.gr/](http://cartesiuscoffee.gr/)
 * Alex GR

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

 *  [Mr Case](https://wordpress.org/support/users/mr-case/)
 * (@mr-case)
 * [10 years, 5 months ago](https://wordpress.org/support/topic/make-slider-full-width/#post-6871634)
 * here is a super hacky way to get gett done
 *     ```
       .siteorigin-panels-stretch.panel-row-style {
           padding-left: 37.9% !important;
           padding-right: 0 !important;
       }
       .crellyslider {
           margin: 0 !important;
           margin-bottom: -54px !important;
           width: 100% !important;
       }
       .cs-slide {
           margin: 0 !important;
           width: 100% !important;
       }
       #main {
           padding-top: 0;
       }
       #page {
           margin-top: -24px;
       }
       ```
   
 * it will probably have undesired effect on rest of site
 *  Theme Author [Shaped Pixels](https://wordpress.org/support/users/shaped-pixels/)
 * (@shaped-pixels)
 * [10 years, 5 months ago](https://wordpress.org/support/topic/make-slider-full-width/#post-6871659)
 * A little difficult because it’s a page builder, but, after trying a few options,
   I came down to this one:
 *     ```
       .home #main {
           padding: 0;
       }
       ```
   
 * Then make any padding or margin adjustments as needed to that. Your slider will
   also need to compensate for the width, especially if you want it to be a fluid
   width for larger screens.
 * The custom CSS I have above will focus on the home page only.
 *  Thread Starter [Alex GR](https://wordpress.org/support/users/alex-gr/)
 * (@alex-gr)
 * [10 years, 5 months ago](https://wordpress.org/support/topic/make-slider-full-width/#post-6871707)
 * Thank you for your time and interest Mr Case and once again Shaped Pixels.
 * Both methods fix the Slider Placement but also influence undesirable the Rest
   of the Page,
    How could I fix it ?
 *  [Mr Case](https://wordpress.org/support/users/mr-case/)
 * (@mr-case)
 * [10 years, 5 months ago](https://wordpress.org/support/topic/make-slider-full-width/#post-6871734)
 * try this. target the first element specifically using its ID
 *     ```
       #pg-4331-0 .siteorigin-panels-stretch.panel-row-style {
           padding-left: 37.9% !important;
           padding-right: 0 !important;
       }
       .crellyslider {
           margin: 0 !important;
           margin-bottom: -54px !important;
           width: 100% !important;
       }
       .cs-slide {
           margin: 0 !important;
           width: 100% !important;
       }
       #main {
           padding-top: 0;
       }
       #page {
           margin-top: -30px;
       }
       ```
   
 *  Thread Starter [Alex GR](https://wordpress.org/support/users/alex-gr/)
 * (@alex-gr)
 * [10 years, 5 months ago](https://wordpress.org/support/topic/make-slider-full-width/#post-6871805)
 * Thank you Mr Case for your helpful suggestions, with a delay due to Christmas.
 * It seems to work fine in the Desktop Screen but if you turn to smaller portrait
   form screens , where the left Header design transforms to Top Header, the Slider
   is misplaced.
 *  Theme Author [Shaped Pixels](https://wordpress.org/support/users/shaped-pixels/)
 * (@shaped-pixels)
 * [10 years, 5 months ago](https://wordpress.org/support/topic/make-slider-full-width/#post-6871808)
 * I just checked your site out and squeezed my browser down to mobile sizes, but
   on my end, your slider looks very good with perfect margins around it. I also
   used my phone to view it and my ipad.
 * I’m thinking perhaps it’s a browser issue…is it possible for you to make a screenshot
   of what you are seeing as being “misplaced”? Also, what browser are you viewing
   it in?
 *  Thread Starter [Alex GR](https://wordpress.org/support/users/alex-gr/)
 * (@alex-gr)
 * [10 years, 5 months ago](https://wordpress.org/support/topic/make-slider-full-width/#post-6871828)
 * Shaped Pixels,
 * In my comment I was referring to the implementation of the CSS changes proposed
   by Mr Case, in his latest contribution, following the discussion to make the 
   Slider full width.
    The above CSS change leaves, just in the Top Menu Version(
   small screen), a big white column on the left side of the Slider, on my side (
   Ffx Browser). The rest of the Page is , I think, OK.
 * Where you referring to the same case or to the initial CSS setting ?
 * Alex GR

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

The topic ‘Make Slider full width’ is closed to new replies.

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

 * 7 replies
 * 3 participants
 * Last reply from: [Alex GR](https://wordpress.org/support/users/alex-gr/)
 * Last activity: [10 years, 5 months ago](https://wordpress.org/support/topic/make-slider-full-width/#post-6871828)
 * Status: not resolved