Changing font-family messes up my nav hover effect?

[ewwatson]

So now I begin the part where I trouble shoot potential problems - by enlarging text, changing font-family, and so on, and watch as my layout crumbles.


Right now the font-family for everything is Tahoma, Geneva, Arial, Helvetica, 'MS Sans Serif', sans-serif;. If I pretend that my computer does not have Tahoma or Geneva and that it just has Arial - then my nice hover effect on the navigation menu is messed up because the borders no longer line up, because the size of the text changed and therefore the padding along with it. What is the best way to alleviate this problem? I know that I can probably fix this with a fixed pixel measurement for the Nav, but I don't want to do that . How do you guys remedy this? Thanks Discount Site Design


My guess is a line-height issue? But before I do trial and error until the cows come home.... maybe someone can see right off the bat what it is, and save me some frustration? Or maybe I should just set the nav links as Arial for good and adjust correctly for that font.... because everyone has that font. What do you guys think?.

[Toon]

I would think an extra amount of padding around the text would give enough protection for the font size change meaning everything will remain inline