full width rows

Beaver Builder
1

Hi,

I would like to know if you could help me making the beaver builder rows full width on my website:
https://positivepsychologyprogram.com/tooldev/

so the front page looks like this:
https://dl.dropboxusercontent.com/u/23483470/beaverbuider%20layout.png

I created an admin account for you:
[access details redacted]

hope you can help! Thanks in advance,
Hugo

2

[Content Hidden]

3

Hey Hugo,

The CSS snippet below should do the trick! Take note though, that you have several negative margins on your homepage layout, so you’ll see it a bit messed up when you apply the code. I’ve created a new page titled BB Test Page. You can open this up and you’ll see how it goes edge to edge.

.fl-builder .content-outer-wrapper > .container.main {
  max-width: none;
  padding: 0;
}
.fl-builder .content-outer-wrapper > .container.main .row {
  width: 100%;
  margin-left: 0px;
  margin-right: 0px;
}
.fl-builder .content-outer-wrapper > .container.main .row > .columns {
  padding-top: 0px;
  padding-left: 0px;
  padding-right: 0px;
}

I’ve also made it so the code only applies to pages you’re using the page builder on. :slight_smile:

Ben

4

Hi Ben,

Thanks for your swift reply! Perhaps I am missing something, but I have added your code to the custom css field of my theme and the content is still not full width. Maybe I have done something wrong? Would you mind have another look?

All the best,
Hugo

5

Hey Hugo,

I just checked the site and it’s already full width. You can check the BB Test Page I created to see the content going edge to edge.
https://positivepsychologyprogram.com/tooldev/bb-test-page/

Ben

6

Hi,

Thanks, I am sorry, I needed to clear my cache.
Thanks for your help, greatly appreciated!

All the best,
Hugo

7

Awesome! And thanks for taking the time to inform us, Hugo. :slight_smile:

Enjoy!

Ben