Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
  • #1199304

    Hi guys!

    I wanted to have my LayerSlider + the orange Color Section Bar under the Slider to be Full Width together.

    I thought about adding code to shrink the slider with the px of the orange color section but it didn’t work so far.
    Is there a solution for this?

    Thanks in advance!


    Hey Sheraly93,

    I’m not sure I understand what you would like to change, could you try to explain a bit further or post a screenshot highlighting your intentions please?

    Best regards,


    I hope the image explains it further. I don’t want to have some white space under my orange color section. And I also don’t want it to be too huge for other monitors.
    So my idea was to scale the slider with 100%-the color section height and the menu height.
    But I didn’t find any option to do that. And any code I tried didn’t work either.



    Sorry for delay. We can’t seem to reproduce the issue on our end. The above the fold content are fully visible in the screen and there’s no extra space below the orange bar. They are both full width as well.

    Best regards,


    So the menu + slider + the orange color section together is always 100% height on every monitor you tried?
    On all the monitors I tested it’s different. Some have white space under the orange box and some even don’t show the white arrow of the orange box because it’s too big to fit on the monitor.
    You can set color sections to 100% height. But that only scales the color section and I don’t want a color section that big. I want it like I showed you in the picture.
    The Slider should have 100% height minus the pixel of the menu above and the pixel of the box below. That would make the slider + the box and the menu full height on every monitor like if I would use only one color section with 100% (It does the same). I just have 2 elements now so I can’t set one of them to 100%.

    I want the elements fit the whole height of the monitor. And the pixel of the monitors are always different. That’s why I can’t set a fix height for the slider.

    I hope you can understand it better now.
    The picture above should show my problem quite well. I wrote under the orange box that there is some white space I don’t want.



    Thank you for the update.

    It looks fine on a 1920x1020px monitor. If you want the total height of layer slider and the color section to be the same as the height of the browser view port, you will have to create a script that calculates the current height of the browser and apply the returned value as the height of the layer slider and the color section. Unfortunately, this will require a bit customization and is beyond the scope of support. Please hire a freelance developer or contact our partner, Codeable.


    Another solution is to include the content of the color section inside the layer slider and make the slider inherit the height of the view port. You can do it in the Slider Settings > Layouts panel. Set the Slider Type to Full Size and toggle the Mode from Normal to Hero Scene.

    Best regards,


    Thank you for the information!

    I thought maybe there is an option for that in the layer slider menu I didn’t find!

    I will see what the best of your mentioned solutions is.
    You can close this thread :)



    I’m glad this was resolved. If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

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

The topic ‘LayerSlider WP + ColorSection on Full Width’ is closed to new replies.