Border in Row


Is there anyway to remove this “border” in rows?
Like, leave the box text full height?

With border

I’ve tried to take off padding, margin, add custom css,
but i don’t think i’m doing it right

I wanna leave like this:

Please helpe me :slight_smile:

Maybe try having the background color of the two text widgets to the right be the same color? ex. lime green for the first one and pink for the second one, + reduce space to 0px between the two columns and set top/bottom padding of the row to 0px

Hello there,

Try doing the following steps:

  1. Edit row > Row Styles > Attributes. In the Row Class field, enter a custom class name e.g. my-row;

  2. Expand the Layout tab, enter 0 in the Top/bottom padding option;

  3. Replace all 3 existing widgets in each column with Layout Builder widget and set its background color. Inside it, create a single row with Top/bottom padding: 20. And then insert your widget into it.

  4. Apply the following custom CSS code into your site’s additional CSS option which resides under the Appearance > Customize > Additional CSS:

@media only screen and (max-width:780px) {
  .my-row .panel-grid-cell {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-bottom: 0 !important;
  .my-row .panel-widget-style {
    padding-left: 15px;
    padding-right: 15px;

@media only screen and (min-width:781px) {
  .my-row {
    position: relative;
  .my-row .widget_siteorigin-panels-builder {
    position: relative;
    z-index: 2;
  .my-row .panel-grid-cell:nth-of-type(3):after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    width: 50%;
    height: 100%;
    background-color: #D830DB;
    z-index: 1;    


I hope I’ve explained myself well.


It Worked!
Thank you so much!

You’re welcome!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.