Page looks different in the same version of Firefox on different computer with the same system
I asked that question before but with a little dose of irony in relation to Firefox and without any example, so my question was downvoted and I have requested to remove that.
Now I have example of my problem. That take some time to get rid of all ASP.NET crap and make that example readable so I will really appreciate any help.
That site:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
<style type="text/css">
body {
font-family:arial, tahoma, sans-serif;
font-size:12px;
}
.riTextBox {
border:1px solid #aeaeae;
padding:2px 0 2px 1px;
font:11px arial,sans-serif;
width: 70px;
}
.something {
border: 0pt none;
height: 1px;
width: 1px;
}
</style>
</head>
<body>
<div class="WizardInput" style="width: 300px;">
<div>
<span style="display:inline-block;width:60px;">USD $</span>
<span style="white-space:nowrap;"><input class="riTextBox" type="text"><input class="something" type="text"><input class="something" type="text"><input type="hidden"></span>
<span style="white-space:nowrap;"><input class="riTextBox" typ开发者_StackOverflow中文版e="text"><input class="something" type="text"><input class="something" type="text"><input type="hidden"></span>
<span style="white-space:nowrap;"><input class="riTextBox" type="text"><input class="something" type="text"><input class="something" type="text"><input type="hidden"></span>
</div>
</div>
</body>
</html>
Looks like that on my computer:
And looks like that on others computers (here my gf computer):
The difference is about 1px, when I change 300px to 299px then it is crashed everywhere.
Anybody have an idea? It is really hurtful for me, because I need to test sites at my work on Firefox.
Reset the text zoom to a standard value.
I'd also confirm that there isn't a network/linkage issue that is somehow interfering with a stylesheet.
Here's a fiddle (I tried with width: 301px and it seems to work FF5):
http://jsfiddle.net/XUZSF/
It seems that it should fit:
60 + 77 + 77 + 77 ==> 291
But frankly doesn't. It could be the way that text inputs are implemented... Not sure why you don't just use white-space:nowrap on the parent div instead?
Here's width 300 with white-space nowrap on the parent div isntead:
http://jsfiddle.net/EKGk4/
加载中,请稍侯......
精彩评论