Firefox 4 font size variation

I have recently coded a website and tested on all browsers as normal to ensure consistancy across browsers. I have tested on IE 7, IE 8, Chrome and Firefox 3.6.

However, it has been pointed out to me by a user using Firefox 4, that some parts of the CSS are broken. After looking into it, it looks like the font-size is ever so slightly bigger on Firefox 4 than on any other browser, causing text to be pushed down and breaking some of the layout.

I have managed to workaround most of the problems, but the final outstanding issue is that I have a textbox floated to the left with a span, with smaller text inside, floated to the right of it. The span has a border around it and lines up exactly with the height of the textbox. Because of the font-size difference in Firefox 4, the textbox is appearing deeper than it should, meaning that the span no longer lines up at the bottom.

I have had a look around to see if anyone else has experienced any problems with Firefox 4 displaying text bigger than other browsers, but no luck. Has anyone else had the same problem? I don't like "workarounds" - I would rather find a decent solution to this problem - I must be doing开发者_如何学JAVA something strange!

Thanks in advance for your help!

EDIT Code for body to default all font-sizes:

body 
{
    font-size: 69.5%;
    font-family: Tahoma, Verdana, Sans-Serif;
    margin: 0;
    padding: 0;
    background: #4997C4 url(/Images/main_bg.gif) repeat-x left top;
}

Code for one of the problem areas of text:

.content .banner p.content_text
{
    margin: 5px 0 2px 12px;
    font-size: 1.2em;
    color: #38393C;
    width: 374px;
    line-height: 1.3em;
}

You are using relative font-sizes (%, em), so if a user has specified a different default font-size in the browser, the font-size on the page differs. As a solution you could use an absolute font-size, like px. (Same problem with line-height property)

Another problem could be the graphic hardware acceleration in FF 4 (I had some other problems with this), it has some influence on font rendering.

Try switching your font sizes to pixels, from em and see if that fixes it. If it does, then it's a user agent setting that you can't control except by using pixel values.

If that doesn't we'll need more information. What platform are you running FF4 on, vs FF3.6 and the others? Anything on a Mac will appear different, because of the way Mac handles fonts, for example.