HTML Configuration: Hide for Mobile Example

Question

My signature is too big for mobile devices. I would like to create a new signature so that when my message is viewed on a mobile device, a compact signature appears; when open on a desktop or tablet, a full signature appears.
 

Solution: hideForMobile

It is possible to hide larger components e.g images of your Signature when viewed on a Mobile Device,

Below is the relevant HTML code:

@media only screen and (max-width: 450px) {
.hideForMobile{
display: none !important;}}
 

Example: Hiding the Logo

The below logo needs to be hidden when viewed on a Mobile Device:



Below is a screen capture of the HTML using the hideForMobile class, added to the image tag:


 

Example Results

 



Click here for an example of HTML code.