我有这个代码,它在firefox vs chrome中表现不同。
<h2>Presenting
<span style="font-weight:bold">Analytics by </span>
<div class="fi_logo"><img src="IMAGEURL" /></div>
</h2>
上面引用的类fi_logo是:
.fi_logo {
min-width: 35px;
height: 35px;
margin-left: 40px;
position: absolute;
top:-5px;
left: 262px;
float:right;
}
在firefox中,图像和文本之间的fi_logo中的margin-left会导致偏移(在h2中)。如果我不添加左边距,则图像与chrome中的文本重叠。
因此,简而言之,如果我添加margin-left属性,它在chrome中工作,而它会在firefox中产生大的偏移量。关于如何解决这个问题的任何建议?
答案 0 :(得分:0)
也许你设置.fi_logo display:block
答案 1 :(得分:0)
div
中的图片标记未正确关闭,而css
中的类定义错误;该类由点(.
);
答案 2 :(得分:0)
我认为,您的问题在于特定的浏览器版本。 我在FF 3.6.2中检查了它,它返回了与Chrome相同的结果
答案 3 :(得分:0)
嗯,听起来你还没有对它进行整理,所以我会做一些评论。
我不能确切地说是什么导致了浏览器的不一致而没有做一堆试验和错误,但我认为修复它的方法是重新考虑你定位图像的方式。
将img绝对定位,浮动它并添加左边距似乎很糟糕。鉴于所有这些,目前还不清楚你甚至试图用这段代码完成什么。
如果你编辑你的问题来描述你想要如何定位图像,我(或其他人)会非常乐意推荐一个好的方法
答案 4 :(得分:0)
这是:http://jsfiddle.net/bikerabhinav/mpL79/2/ 使用位置相对和绝对的组合。 另外,不要在h2中使用div - bad markup
答案 5 :(得分:0)
您的HTML无效。你不能在标题中有一个div。我也质疑浮动和绝对定位在同一个元素上。我也想知道你是否使用了doctype。