1

我最近一直在做网站，遇到了一个大问题：http://jimbob.webatu.com/index.html（您需要查看网页上的编码）。我已经设置了我的网站所以有两个主要列，但居中在中间。 id wrap 是将所有内容居中，两列向左或向右浮动：

     #wrap    {
     width:750px;
     margin:0 auto;
     background-color:#6E6E6E;
     border-left:3px solid #A9E2F3;
     border-right:3px solid #A9E2F3;
     }
     #main    {
     float:left;
     width:496px;
     background:white;
     border-top-right-radius:5px 5px;
     border-bottom-right-radius:5px 5px;
     }
     #sidebar {
     float:right;
     width:250px;
     } `

最近虽然我尝试添加一个页脚栏，例如顶部的导航栏。这已通过使用“clear：both”设置为整体保持在经线中，并一直试图使其完全避免“wrap” id。但是出现问题并且控制“wrap”和“secondborder”的div不会完全关闭。此外，您可能会看到后面出现了一个灰色条，并且“换行”背景将不适用（我已将侧边栏背景设置为空，以便“换行”背景适用于它。这使它看起来更整洁） .我无法粘贴所需的编码，因为太分散且太长（查看网页上的页面源）。谁能为“换行”背景和“页脚”提供解决方案 不居中？在过去的 3 个月里，我只学习了 html 和编码，所以如果这是我犯的一个愚蠢的错误，请原谅我。再次链接到我的网站问题所在：http://jimbob.webatu.com/index.html

4

3 回答 3

3

添加溢出：隐藏；到你的#wrap

#wrap {
    width: 750px;
    margin: 0 auto;
    background-color: #6E6E6E;
    border-left: 3px solid #A9E2F3;
    border-right: 3px solid #A9E2F3;
    height: auto;
    overflow: hidden;
    }

为了让您的#footer 像页面底部的页脚一样，您必须将其从#sidebar 中取出并放置在#sidebar 关闭之后。这应该可以解决您的问题。

要修复#sidebar被切断，您需要将其向左浮动而不是向右浮动，

#sidebar {
    float: left;
    width: 250px;
    }

希望这会有所帮助。

于 2012-06-12T09:09:13.507 回答
0

一般来说，你需要在你的浮动之后清除div。这告诉浏览器停止下一个元素的浮动。查看您在之前添加的 HTML<div id="footer"> <br style="clear:both" />

此外，在您关闭之前#wrap添加另一个<br style="clear:both" />

于 2012-06-12T08:54:49.470 回答
0

我刚刚在您的 secondborder 元素中添加了一个新的 div：<div style="clear:both"></div>这对问题进行了排序。您正在浮动并且没有清除侧边栏或主 div。

于 2012-06-12T08:57:09.923 回答