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, 6 years ago

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

See why 200,000 companies worldwide love Campaign Monitor.

From Australia to Zimbabwe, and everywhere in between, companies count on Campaign Monitor for email campaigns that boost the bottom line.

Get started for free