two color row - Forum | JoomShaper
Awaiting an answer SP Page Builder

two color row

Asked by Robert 3 years ago Last activity 3 years ago

8 replies

Paul Frankowski Senior Staff
3 years ago · edited

Hi Robert,

there are few ways to do that,

I would try with bg gradient settings with two colors. Using this same method to get that button

info_856_2023.jpg

info_857_2023.jpg

Just change value of Angle from 180 to 90.

info_858_2023.jpg

And different colors ;)

Paul Frankowski Senior Staff
3 years ago · edited

so think as home painter:

If your row has two columns: set bg grey to fist one and bg red to second one, no need to combine.

info_862_2023.png

Just remember to set full width with container inside.

I gave you only one example how it can be done if you need something beyond the classic, as we can say "art for art's sake".

Robert Asked this

Full width goes only in the the row itselve. Not in the columns. Doing so the content goes also full width. Tried that.

Paul Frankowski Senior Staff
3 years ago · edited

class name: container - you can use it inside, for example, columns class or row class.


besides there is something named: nested row (row in the row) >> https://youtu.be/tqpjj0a5lbc?t=300
that you can can use for whole 1 column inside row, then two columns inside etc.
https://www.joomshaper.com/documentation/sp-page-builder/sp-page-builder-backend-editor/add-nested-row

Anyway, watch Video tutorials of that guy. In case of I can create video for my own channel.

Paul Frankowski Senior Staff

I hope you noticed that you can change padding/margin for mobile view using icon [mobile, tablet] and different value.

So I guess, task solved.

Robert Asked this

Yes, I know.

Thanks for the hints into the right direction Paul! Much appreciated.

Log in to reply.