Never got it to work: Full-width with Ascension theme

Beaver Builder
,
1

Hello everyone,

Thank you in advance for helping me with this challenge I am facing.

I am trying to have full-width rows and content, end to end, using Beaver Builder. I have been on BB for 2 years and I am yet to find a way to have full-width with the Ascension theme.

If you do share some code, please explain in detail where to place it.

You can view the landing page here

Here is a screenshot of page

BB full width.PNG
BB full width.PNG1360×514 140 KB

Thank you, Osama

2

Hi Osama,

This is the css that will work for desktop screens:

#content {
	max-width: 100%;
}

#primary {
	padding-left: 0;
	padding-right: 0;
}

If you are using a child theme, put this code in style.css. Or you can use the customizer. Appearance > Customize > Additional CSS. Most themes have this option. If you can’t find this, look in the Beaver Builder documentation for information on adding global CSS. Where to add custom CSS | Beaver Builder Knowledge Base

1 Like
3

@craiger522 THANK YOU very much. I pasted the code in BB settings of the page Layout CSS and it worked. I also tried from BB Global settings CSS and it worked. I am going to keep the code at page level as I don’t need to have the full width on all pages. Thank you once again.

Best regards, Osama

BB full width worked
BB full width worked1366×611 611 KB

4

UPDATE!!
While working on BB it does show full width when adding the code to CSS, however, the full width is not shown in the browser. So I added the code to the CSS of the theme and it worked.

BB full width worked from main theme
BB full width worked from main theme401×533 50.6 KB

5

I’m having the same issue with the Astra theme and I’ve tried pasting the CSS code in both BB and WP and nothing has changed. I put it under Customize in WP (under Additional CSS for the them) and when in BB in put it under Layout CSS/Javascript. This is what I put (I copied it straight from the post here). This is my own site and the first time I’ve used WP.org or BB so I have no clue but I want the rows to go all the way across the page and have it set at Full With and it still has a huge white boarder around the entire page - which is why I went searching here in the forum. I also tried inserting !important but that did nothing either. Is there anything else I can try or am I stuck with this boarder? (If I even knew how to change the color of the boarder it would help!). Thanks in advance.
#content {
max-width: 100%;
}

#primary {
padding-left: 0;
padding-right: 0;
}