Hi guys,

I've searched around for this question but not found so far. When I have an absolutely positioned div with some text in it, set to say 25px, Helvetica, font-weight:normal;

div is width:162px; height:26px;

text is "Sammy Brown"

In FF and Safari on the Mac, 'Brown' is on a new line. On a pc, its on the same line. Fair enough right? no surprises here what with anti aliasing etc.

When I then set: width:auto; height:auto; firebug reports the same dimensions as before but sammy brown is all one one line.

If i then do:

var $text = $('div.text');

$text.css({
width : $text.outerWidth()+'px',
height: $text.outerHeight()+'px'
});

We end up with height:26px, width : 162px again, and "brown" is on a new line.

Any clues? I humbly turn to the larger community for help. Doesn't look like this is a jQuery prob.. more of a ... how can we work around this with jQuery?