CSS iOS div lines disappear on zoom in

Problem

In iOS devices sometimes safari can display an annoying line above and below div elements.  Like so:

Unwanted div lines

 

Solution

The solution is quite hacky and hopefully this is a bug in Safari and it gets fixed soon.  The solution is to put a negative 1px margin on the sides you see the lines.  So if you see the lines above a certain div, set the top margin to -1px.

Thanks to this blog for the solution.

 

Tagged with: , ,

Leave a Reply

Your email address will not be published. Required fields are marked *

*

This site uses Akismet to reduce spam. Learn how your comment data is processed.