如何使用构造函数主题修复 Wordpress 中的浮动侧边栏？答案

【问题标题】：How to fix float sidebar in Wordpress with Constructor theme?如何使用构造函数主题修复 Wordpress 中的浮动侧边栏？
【发布时间】：2013-02-09 02:11:45
【问题描述】：

请帮助我修复或解决有关侧边栏定位的问题。我在右侧边栏布局中有一个带有构造函数主题的 Wordpress。该网页可以在以下链接中看到。（一个有一个高头菜单另一个有一个短。侧边菜单的高度也不同。）

http://salvavita.hu/web_2012/

http://salvavita.hu/web_2012/?page_id=119

html结构如下：

<div class="wrapper" id="wrapcontent">
    <div class="box shadow opacity layout-right" id="content">
        <div id="container">
            content stuff
        </div><!-- id='container' -->

        <aside id="sidebar">
            sidebar stuff
        </aside>
    </div><!-- id='content' -->
</div><!-- id='wrapcontent' -->

由于某种原因，侧边菜单被换成新行并被按下到左侧，在容器外部。您可以在页脚顶部看到它。 如何强制侧边栏与内容在同一行呈现？（所以它会粘在网站顶部红色部分的底部。）

首选纯 CSS。此时，如果溢出到右边的内容就可以了。（位置固定不好，因为有两种类型的标题高度，它也必须与恢复的向下窗口一起使用。）

理论上，布局是：宽度：968 像素侧边栏宽度：220px 额外侧边栏宽度：120px（未使用）标题高度：518px（具有自定义编码的短变体）

感谢您的帮助，

西罗

【问题讨论】：

您的列太宽。 #Container + #Sidebar = 972px 所以侧边栏会下降到下方。

标签： php css wordpress constructor

【解决方案1】：

Alan Jenkins 是对的，如果您将#sidebar 的宽度从 216px 更改为 208px，那么边栏就可以正常工作。您对主容器上的大右侧边距和侧边栏上的负左手边距所做的事情对我来说似乎有点奇怪。如果是我，我可能会做类似的事情；

.layout-right #container {
    /* (Line 197 remove the following rule) */
    margin-right: 220px
}

.layout-right #sidebar { 
    /* (Line 202 remove the following rule) */
    margin-left: -220px;
}

#sidebar {
   /* (Line 208 reduce the width slightly and change the float from left to right) */
   width: 208px;
   float: right;
}

【讨论】：