1

我在使用 wordpress 模板时遇到了一个非常奇怪的问题。我想像这样放置 2 个 div:

<div style='float:left;'>
    left div
</div>
<div style='float:right'>
    right div
</div>

通常这可以正常工作 - 两个 div 应该直接相互粘连 - 但是 style.css 中的某些内容(使用 css 重置)会导致右 div 与左 div 重叠约 5 像素。我搜索了整个.css,但找不到:((这只是一个事实,它必须是默认css的东西。

任何人都知道是什么原因造成的 - 一些修复?

谢谢

4

5 回答 5

0

你们中的任何一个divs都有宽度吗?给他们一个width, float BOTH left并添加margin-right到第一个 div。

确保您的宽度 + 边距加起来不超过周围的 div。例如,如果您周围的 div 是600px您的框,则不应超过左侧 div 上的width:290px;a 。margin-left:20px;

此外,您可以使用Firebug或任何其他 Web 开发浏览器工具来检查样式表中的哪些样式正在影响您的 div。

于 2011-03-08T16:27:17.573 回答
0

向左浮动或使用内联块。您也可以只浮动第一个左侧。

于 2011-03-10T04:05:08.550 回答
0

我强烈建议您(如果您还没有)下载 FireFox 并安装 Web Developer Toolbar 插件。这个插件非常适合追踪这样的问题。当您查看有问题的页面时,在此工具栏的 CSS 部分下,您可以选择“查看样式信息”。然后只需单击页面上存在问题的 div。在左侧,您应该会看到一个小窗口弹出,其中显示了影响这些 div 的所有样式以及它们来自什么 css 源。使用 CSS 如果您依靠“错误”修复来修复不是真正错误的事情,那么在大多数情况下,您只会在以后引起更多头痛。

于 2011-03-10T04:37:23.050 回答
0

我认为问题可能出在代码中的其他部分。我可以建议清除浮动:

html:

<div class="clear"></div>

CSS:

.clear {
     clear: both;
}

您发布的代码可以正常工作,但我希望您有更多的 div 或容器或某处弄乱它的东西。

于 2011-05-26T09:20:13.167 回答
0

总宽度 = margin_width + border_width + padding_width+ 框的宽度 +(其他框相同)。

确保为两个浮动设备定义了宽度。最好的方法是按 F12 调试代码。您可以使用 FireFox、IE、Chrome 或 Safari,但通常您必须自己启用此选项。

于 2012-01-22T01:40:25.640 回答