Columns On Home Page

[naegon]

I was trying to figure out how to add a two column row in the widget areas. I installed a plugin called Widgets in Columns which allowed me to add two widgets side by side. On the website it looks perfect, but on the mobile site it looks awful. The slider appears on top of the other widget. Is there any way to fix it or to add two columns through custom CSS to improve the appearance on the mobile site?
The two widgets I have in one row are the Text widget and a slider from a plugin called Featured Articles Lite 3.

[Bill Robbins]

It might work out best to switch the columns to be full width on smaller screens. You could do that this way:

1. Go to your theme options page and choose the Advanced tab.
2. Scroll down to the Custom CSS box and add this:

   
   @media only screen and (max-width: 767px) {
   
   	.widget-wrap .one-half {
   		clear: both;
   		width: 100%;
   		margin-right: 0;
   		margin-left: 0;
   	}
   
   }
   

3. Update your settings.

Let me know how that goes.

Have a great week,
Bill

[Author]

Posts