Removing email images in Mobile Setting

Hey Pete,

You can generally do this pretty easily with CSS media queries. It tends to look something like this:

@media only screen and (max-width: 380px){
     .hide-mobile {
          display:none !important;
          overflow:hidden; 
          mso-hide:all;
          margin:0;
          font-size:0; 
          max-height:0;
     }
}

Note that this will not work with absolute consistency across all email clients - some don't accept CSS styling. You'll find it helpful to test across your priority email clients using a tool like Litmus or Email on Acid.

Hope that helps.

Hey Pete, I've also had inconsistent results when trying to hide stuff for mobile in email. Another approach to this that might be more effort is to think about this the other way around and coding the image to be hidden and then using media queries to show it at larger sizes - which generally means more CSS is accepted b/c your in a "bigger" (i.e. desktop/tablet) environment rather than a mobile system. It's probably a lot more work to turn a template 'upside-down' and code it to be mobile first, but that's the only sure-fire way I could think of to accomplish this with any consistency.