cancel
Showing results for 
Search instead for 
Did you mean: 

Page Builder Mobile Options

Highlighted

Page Builder Mobile Options

I've built out image links with Page Builder into columns that are 4 across on desktop (using drag-and-drop, no coding). But when viewed in mobile the image links are displayed in a single column. Is there any way to make rows display as 4 column on desktop and 2 column on mobile? Thanks. v2.3.5

2 REPLIES 2
Highlighted

Re: Page Builder Mobile Options

<div class="container">
  <div class="row">
    <div class="col-sm">
      One of three columns
    </div>
    <div class="col-sm">
      One of three columns
    </div>
    <div class="col-sm">
      One of three columns
    </div>
  </div>
</div>

The above example creates three equal-width columns on small, medium, large, and extra large devices using our predefined grid classes. Those columns are centered in the page with the parent 

Highlighted

Re: Page Builder Mobile Options

Thank you for this. I'm not a coder so I was hoping for a solution that was within the WYSIWYG framework (the drag-and-drop columns and rows blocks). Is it possible to have the 4 column wide on desktop and 2 column wide on mobile with WYSIWYG?

 

If I need to go the coding route how would I create a desktop view of 4 columns and 2 rows and a mobile view of 2 columns 4 rows? Thanks again.