Question

On my site I am using padding to control the size of my navigation buttons:

#topnav a {
    padding: 2px 34px;
}

This works fine on all the desktop browsers including Safari and Chrome (which use desktop Webkit).

However, on Safari for ipod and the Google Android Browser, the padding seems to be read wrong and the navigation goes onto two lines (thus breaking the rest of the layout). How can I fix this?

(PS. The site isn’t mobile friendly, but I would still like it to display correctly).

Answer 1

I think it’s just the font size that increases on mobile.

Use this to prevent it:

* {
    -webkit-text-size-adjust: none;
}