2

任何想法我如何摆脱我的 IE 浏览器上的空白。它是由隐藏的 div 引起的。当我删除 div 时，空白会消失。在 FF 中运行良好。

这是DIV：

 <div class="hidden" id="popup">
    <div>
        <H1 class="center" id="popupTitle"></H2><br/><br/><br/>
        <div style="position:relative; display:inline;">
            <p id="popupText" style="float: left"></p>
            <img id="popupImage" style="float: right"></img>
        </div>
    </div>
</div>

以下是与之相关的样式：

.ofCommunications .hidden    { display:none; visibility: hidden; }

我也试图让第三个 div 中的 p 和 img 显示在同一行，但这似乎也不起作用。

提前感谢卡罗琳

4

4 回答 4

1

间距问题很可能是由于您不正确地关闭标签（“”）以及同时使用 display: none; 和可见性：隐藏；

可见性会导致元素仍然占用空间，所以你需要摆脱那种风格。

如果您进行这些调整，它应该可以工作，除非您在提供的代码中没有看到其他问题（例如：您的 .hidden 的父容器具有拼写错误的类名）。

提示：切勿使用 <br/ > 标签创建空间。它们仅用于破坏文本。摆脱显示：内联；和位置：相对；在您的另一个 < div > 上，因为将它放在那里没有意义（相对定位是默认设置）。小写所有标签。大写标签是遥远的过去，并不理想。

于 2012-10-10T18:53:29.387 回答
0

一些评论。一旦你清理它，它可能有助于解决这个问题和其他未来的问题：

删除您的内联样式并将它们放入样式表中。

第二个 div 在隐藏的 div 下做什么？对我来说，它看起来多余且不必要。去掉它。

如果你是浮动元素，那么你需要在轨道上清除它们。这可能就是为什么你的东西漂浮在错误的地方。

你有没有 display:block'ed 图像旁边的 p 元素并给它一个宽度？否则无论如何它都不会漂浮。

你的 h1 不应该是大写的。

希望这几条建议能有所帮助。

于 2009-09-24T16:18:58.827 回答
0

试试这个来得到<p>和<img>排队：

<div>
    <p id="popupText" style="float: left"></p>
    <p style="float: right"><img id="popupImage" /></p>
</div>

我删除了，position: relative因为您提供的代码不需要它，并且display: inline因为使 div 内联没有意义。

于 2009-09-24T16:35:29.557 回答
0

你检查过父元素的宽度吗？如果父元素的宽度设置得太小，将没有足够的空间在同一行上呈现段落和图像。这可能会导致您的段落和图像在不同的行上呈现。

于 2009-09-24T20:22:26.467 回答