Question

我的一个朋友向我求助，但我无法发现错误。这是关于：
http://www.nachhilfe-hh.de/nachhilfe-hamburg-west.php

问题是手机图像被剪切，文本与Internet Explorer重叠。 Firefox运行正常。我用Firebug分析了CSS，发现缺少“＆lt; / div＆gt;”。这解决了一个问题，但没有解决问题。如果我尝试更改图像的宽度：不会发生。如果我试图改变文本的位置：IE或Firefox中的外观很糟糕。并改变“＆lt; div＆gt;”到“＆lt; span＆gt;”也没有任何影响。

有人有想法吗？ PLS？

Answer 1

.telefoncontainer获得width:329px，图片中有一张370px。

它适用于其他浏览器，因为.telefoncontainer p的宽度很好。但IE忽略了孩子的宽度来调整父母的宽度。

Answer 2

首先关闭：仍然缺少</div>：http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.nachhilfe-hh.de%2Fnachhilfe-hamburg-west.php

我建议避免position: relative。它是重叠的原因，即使你在这种情况下发现错误，它也可能导致其他地方更多的重叠。

将telefoncontainer的HTML简化为：

<div class="telefoncontainer">
   <div id="stadt">Nachhilfe Hamburg West</div>
   <div id="telefon">040 / 839 75 03</div>
</div>

（所有额外的p，div和center都是不必要的。）

然后只需调整容器的padding，直到内容正确定位。

示例：http://jsfiddle.net/sVhd2/

Answer 3

您是否尝试过使用条件评论专门针对IE？这将允许您为每个浏览器设置不同的样式，因此一个中的更改不应该破坏另一个。请参阅：http://www.quirksmode.org/css/condcom.html，了解这些

的功能和用法

奇怪的Internet Explorer和Firefox CSS问题

3 个答案: