css - Layout issue in webkit and moz

Question

I have a layout issue in my web page where I have (for example:)

<div style="position:relative;width:500px;min-height:300px;background:red">
  <input type="text" style="position:absolute;top:20px;">
  <input type="buttton" style="position:absolute;bottom:2px;right:2px">
</div>

The positioning is slightly different in different browsers (say about 2-4 pixels). For example, the above button is a few pixels apart from the border in chrome or safari than firefox, seamonkey and opera. Is there a solution to this problem so that the layout looks almost same in different browsers?

Answer 1

首先重置和统一你的 CSS。结帐http://html5boilerplate.com/以获得良好的开端。