0

我希望有人可以帮助，我无法解决这个问题。我正在使用 _s 模板创建一个 wordpress 主题，但我的右栏有问题。

如果我只插入一堆换行符，则流程是正确的。但是，只要我插入任何文本、img 或其他任何内容，该数据就会低于中心列。

我知道这很简单，我只是没有看到。

这是该页面的链接。 http://juststin.com/test/help.html

这是CSS

.content-area {
        float: left;
}
.site-content {
        margin: 0 20%;
        width: 60%;
        -moz-border-radius: 25px 25px;
        border-radius: 25px 25px;
        border-width: 5px;
        border-style: solid;
        border-color: #333333;
        background: #ffffff;
}
.pictures {
        margin: 0 81%;
        width: 20%;
        -moz-border-radius: 25px 25px;
        border-radius: 25px 25px;
        border-width: 2px;
        border-style: solid;
        border-color: #ffffff;
        background: #ffffff;
}
.site-main .widget-area {
        float: left;
        margin: 0 0 0 -100%;
        width: 20%;
        background: #2E9AFE;
        background: #333333;
}
.site-footer {
        clear: both;
        width: 100%;
        background: #ffffff;
        -moz-border-radius: 25px 25px;
        border-radius: 25px 25px;
        border-width: 5px;
        border-style: solid;
        border-color: #333333;
}
.site-header {
        clear: both;
        width: 100%;
        background: #ffffff;
        -moz-border-radius: 25px 25px;
        border-radius: 25px 25px;
        border-width: 5px;
        border-style: solid;
        border-color: #333333;
}

.menu-div {
        border-width: 2px;
        border-style: solid;
        border-color: #ffffff;
        background-color: #ffffff;
        -moz-border-radius: 25px 25px;
        border-radius: 25px 25px;
        overflow: visible;
}

#page {
        width: 90%;
        margin: 0 auto;
}
4

3 回答 3

0

您确实需要对列布局标记进行一些更改。我对您的标记和 css 进行了一些编辑以使其正常工作（我不建议您使用它。）。看看http://pastebin.com/raw.php?i=hqi0MLTc

题外话：就我个人而言，我更喜欢对侧边栏/左右列使用固定宽度，仅对内容区域使用流动宽度。

希望这对您有所帮助。

于 2013-03-28T01:55:06.443 回答
0

问题是你奇怪的列布局。给margin-left -100%你.widget-area而不是仅仅在你的#primary专栏之前呈现它。您的#pictures列没有浮动，因此它在100% 的#primary容器之后流动。width

选项 1) 将列放在应该去的地方，不要使用负边距。

#primary选项 2) 为(看起来大约 60% ) 分配一个固定宽度并#pictures向左浮动

于 2013-03-28T00:58:46.607 回答
0

问题最终是我不得不减小右侧栏的大小。我猜测添加边框会将尺寸增加到 100% 以上。

于 2013-03-29T21:25:51.327 回答