Hiding Info from Desktop view


I'm trying to build a template that has 2 columns but will then display as a single column for mobile versions (I do display: none; using media query for screen below 480px in the css).

What I am wondering is if I can have a simpler version of the 2nd column, that I can hide for the normal desktop version but show below the main info in the mobile/iPhone version.

Hope that makes sense. (Basically want something to show in iPhone, but hide on Desktop).

Current issues
Have tried using display: none; inline style
ie <table class="show" style="display:none;">

And use media queries to show this table. However, the table is still showing in gmail and outlook... If i use !important in the inline style, then i can't get the iPhone to show it.

Anyone know of a 2-col template then then shows as a single for mobile? That may have code I need?


oneblackcrayon oneblackcrayon, 5 years ago

Hi bdiddymc!
You may want to try Media Queries as a work around for your two columns/one column layout.

200,000 companies around the world can't be wrong.

From Australia to Zimbabwe, and everywhere in between, companies count on 
Campaign Monitor for email campaigns that drive real business results.

Get started for free