Image half-size on horizonatal mobile unless page refreshed
-
The CSS determiner of image size in the Great theme, applicable to computer, ipad and mobile is:
img {
height: auto; /* Make sure images are scaled correctly. */
max-width: 100%; /* Adhere to container width. */
}What determines the size of the images on a mobile appears to be the orientation of the mobile when the website is first viewed (ie vertical or horizontal). That is apparently the reason that the image size increases when you refresh the website with the mobile horizontal, following a vertical open. If you open up the website on a horizontal device, you get a large image to fit. When you switch back to vertical the image reduces in size, and goes back to large when you go back to horizontal. Unfortunately the image does not become large when you go from an open in vertical to horizontal (Presumably because it is already at 100%?).
I found, installed and tested a plugin (adaptive-images.0.6.60) that claimed to download the correct size image to whatever device you are using, and had a check box for download for horizontal orientation. It made no difference. It appears to be unable to overrule the CSS.
Would any of our readers know if there is a way to ensure that the image is indeed at max width = 100% if the mobile is vertical when the website is first opened then turned horizontal. I would be very grateful for any suggestions, ideas or solutions. Thank-you, schrameck.
- The topic ‘Image half-size on horizonatal mobile unless page refreshed’ is closed to new replies.