Divi Mobile Solutions

How to do Blurbs Side by Side and not Stacked on Mobile

Written by Divi Mobile Team

On October 20, 2016

With Divi, using a blurb module is one of the easiest ways to create a great looking mobile site. A true mobile site increases the interaction with those visiting your site.

One thing people need is the blurbs to be side by side and not stacked on a mobile screen. Watch the video below to see how this happens. The actual code is listed out below. Need help getting a true mobile experience with your site, Contact us for help.

Code for code module.

<style>.mobileColumn {display: inline-block; max-width :50%;} </style>

Row / Custom CSS for each Column Class ID use

mobileColumn

The code is case sensitive.

Blurb One

Blurb Two

Blurb Three

Blurb One

Blurb One

Blurb One

Blurb One

Blurb One

Blurb Two

You May Also Like…

How to Control the Divi Mobile Menu Top Border

How to Control the Divi Mobile Menu Top Border

Adding some color or flare to your divi mobile menu is a nice idea, but what if want to control it on a page by page basis? Yes it is possible with a little bit of CSS. You may even want the whole top border to be gone and not used at all. The CSS is listed below. You...

How To Add Text Above or Below the Mobile Hamburger Menu

How To Add Text Above or Below the Mobile Hamburger Menu

Adding some text below or above the mobile hamburger menu on Divi is really easy to add and edit to your liking.  With the code below simply add it to your Divi / Theme Options / Global CSS and you are done. You can change  the word MENU to anything you like, change...

1 Comment

  1. Isabel Taye

    Thanks for this tutorial. How do you adjust the percentages if your 2 columns are 3/4 and 1/4 in size? Any help would be much appreciated.

    Reply

Submit a Comment

Your email address will not be published. Required fields are marked *