How to resize image for the mobile phones

Using the .mobile maxwidth in the CSS

You just need to make sure you include the DIV id of the image.  In this example below, the DIV ID is HTML4.    Just replace it with your own.

This .mobile section is only used when mobile device is being used.    It will make the max size (width) of an image to be 320.   The height will be auto adjusted and aspect ratio is held in tact.




.mobile #HTML4 img {
max-width: 320px;
margin-top: 10px;
height: auto !important;
width: expression(this.width > 320 ? 320: true);
}


However, this is not required if you have the image width=100% attribute set.     Therefore, don't use barcoded pixel values for the width and height (if you can get by with it).    Also, put things in a table and inside the table attribute just use width=100%