Skip Navigation

[Resolved] Content full width not working

This support ticket is created 6 years ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Our next available supporter will start replying to tickets in about 2.44 hours from now. Thank you for your understanding.

Sun Mon Tue Wed Thu Fri Sat
- 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Hong_Kong (GMT+08:00)

This topic contains 3 replies, has 2 voices.

Last updated by Luo Yang 6 years ago.

Assisted by: Luo Yang.

Author
Posts
#1146109

I am trying to: Style a row in the Layout to show full width.

Link to a page where the issue can be seen: hidden link

I expected to see: The Hero image showing full width.

Instead, I got: The hero image is limited to the container width.

#1146320

Hello,

Thanks for the details, I see you are using bootstrap framework, so you can try the bootstrap full-width CSS "container-fluid",

I have tested it in the URL you mentioned above using Chrome browser
view-source:hidden link

and found two places, line 163:

<div class="uk-container">

You can change it to:

<div class="container-fluid">

Same as above, line 280, from

<div class="container ddl-remove-bs-padding">

to:

<div class="container-fluid ddl-remove-bs-padding">

See screenshot full-width.JPG
It is only an example, you will need to find those codes in your website, and change it

If it is a layout, you can follow our document to setup the CSS class name:
https://toolset.com/documentation/beyond-the-basics/leverage-existing-styles-and-add-new-css/

More help:
hidden link
Use .container-fluid for a full width container, spanning the entire width of your viewport.

#1148111

Ok, thank you for your help.
This is a class automatically applied by the theme I'm using. Is there a way to remove the class uk-container and only apply the one suggested?

Thanks again.

#1148944

There isn't such kind of feature within Layouts plugin, and the "uk-container" CSS class should be defined in your theme files, I suggest you check it with author of your theme file.