我不明白为什么FF和Chrome呈现我的页面不同。这是它的屏幕截图
火狐:firefox example http://grab.by/65Bn
这是一个铬合金的
chrome:chrome example http://grab.by/65BB
字段集有相对位置,图像有绝对位置。
下面是基本结构:
<fieldset class="passenger-info">
<legend>Passenger 1</legend>
<div class="remove-me">
<img src="/images/delete-icon-sm.png" />
</div>
</fieldset>
基本上,图像是在图例之后声明的。
下面是fieldset的css:
.passenger-info {
background:none repeat scroll 0 0 #F2F2F2;
border:1px solid #9D240F;
display:inline;
float:left;
margin-bottom:10px;
margin-right:10px;
padding:3px 10px;
position:relative;
width:350px;
}
对于remove-me图像:
.remove-me {
border:1px solid red;
position:absolute;
right:0;
top:0;
}
这太奇怪了。我试着把fieldset填充放出来,图像稍微上移了一点,但仍然不在角落里。
这篇文章表明FF确实存在渲染字段集的问题。
http://www.codingforums.com/showthread.php?t=132624
有没有更好的方法来修复而不使用特定于浏览器的黑客?
https://stackoverflow.com/questions/3576624
复制相似问题