让 Content-Area 和 Widget-Area 并排放置答案

【问题标题】：Getting Content-Area and Widget-Area to sit side by side让 Content-Area 和 Widget-Area 并排放置
【发布时间】：2017-11-25 10:04:32
【问题描述】：

我的网站是 www.rosstheexplorer.com。

我使用的是 Penscratch 主题，虽然已经修改了它的许多方面。

我最近做了一些改变，包括让我的标题和导航栏全宽。

这些更改的一个意外后果是现在我的小部件区域不再与我的内容区域并排放置。

我使用 Google Chrome 上的开发者工具并开始尝试更改这两个元素的宽度、内边距和边距。我没有尝试过任何接近我想要的结果。我会做更多的实验，但我不知道从哪里开始。

在 style.css 中是否需要对

进行修改

.site-content .widget-area {
    margin-top: 27px;
    padding-top: 24px;
    border-top: 3px solid #eee;
}

或

.widget {
    line-height: 2.09231em;
    position: relative;
    overflow: hidden;
    width: 100%;
    margin: 0 0 27px;
    padding: 0 0 27px;
    border-bottom: 1px solid #eee;

【问题讨论】：

嗨，Ross，乍一看，我发现您的内容位于“#content”div 之外。接下来要解决此问题，您需要在 '#secondary' 中设置 'float:left'。
你指的是这段代码'
'

标签： php css wordpress widget

【解决方案1】：

检查您的网站，据我了解，这是与浮动相关的问题。尝试申请

float:left

为您的“.widget-area”

【讨论】：

我使用了 Rupali Pabla 解决方案，不过谢谢你的想法

【解决方案2】：

看看这段代码是否适合你：

#primary.content-area {float: left;width: 70%;}
#primary.content-area .site-main{width:100%;}
.widget-area{float:right;width:30%;}

【讨论】：

我应该把它放在 style.css 中吗？
谢谢 :) :) :)