iOS Safari Image Placement Issue

Community resources Bugs
1

I have come across an “image placement” issue with iOS / Safari (on an iPad).

Because there is a “work-around”

  • I did not test this on an Android or Window tablet.

I did test this on Window (Desktop IE / Chrome / FF) and a Mac (Desktop IE / Chrome / FF / Safari)…

  • no issues. Result looks like “image 2”.

Both DIV’s set at 50 VH.

2048×1536 2.17 MB

The 2 Photos in the left column are in 2 different DIVs.
The values shown at done on the actual DIV - not the photos.

Both DIV’s set at 50% height.

2048×1536 2.24 MB

This image shows the different values for both tests.

525×851 177 KB

Setting to 50% instead of 50vh is the work-around.

2

UPDATE: This creates an additional problem on iOS iPad devices.

If don’t set a Google Map widget to 50vh… the map is not displayed correctly.
— the map will be “slightly taller” than half the height of the screen !!!

If you then try to set the Google Map widget to 50% height…
— the map will be “slightly shorter” than half the height of the screen !!!

So… (for now) - I have made everything 50%… except the Google Map which is 50vh.

Will be switching to a different map anyways - so (the bugs in the Google Map widget are) not a big deal for me.