[paulmirocha]

Is it possible to make a full-width section or row with a background color? I mean something like the [row] shortcode but with a background color instead of white.

Thanks,

Paul

[serkan]

Hi Paul,
It depends on which area you use. Specifically, if you tell me the page, we might catch up with custom css code.

[paulmirocha]

How about just making this row full width 100% and with a background color:

[row]
[column width="12"]
Content here. Content here. Content here. Content here. Content here. Content here. Content here.
[/column]
[/row]

Thanks,
Pau

[serkan]

Hi Pau,
If you use it in the page you need to add the page id. If you do not do this, col-12 on other pages can be affected.

#page .row > .col-sm-12 { background-color: #449cf5; margin: 0 -340px; }

Thanks

[paulmirocha]

Serkan,

OK. I’d like to make the background-color full width, going to right and left edge of the browser viewport.

Is that possible? I can’t get the CSS to do that.
thanks
–Paul

[serkan]

Hi Paul, I’ve updated the code above. You can eliminate the maximum width by overflowing the margin. Otherwise, a method does not seem possible.

[paulmirocha]

Serkan,

I can’t get that code to work. What I wanted to do is similar to making a full width photo, but this is just a full width type row.

thanks,
–Paul

[serkan]

Hi Paul,
It is not possible to do exactly the same thing because of the row structure. I just tried to do something close to it.