页面重新调整大小时，CSS wordpress页脚小部件堆叠

Question

我使用Wordpress，Twenty Eleven儿童主题。

我有一个问题，当我重新调整页面大小时，所有div移动了。经过坚持不懈，我设法通过在我的body html标记中添加一个包装来解决这个问题。当页面重新调整大小时，这停止了所有div的移动。

#site-wrapper{margin: auto; margin: auto; width: 1000px;} 

这在我的页脚

一跑不过我已经增加了五个部件领域|两个|三| |四| 5

但是，当页面重新大小的部件领域栈上的相互

一个

两个

三

四

五

顶部其他一切正常渲染。 我已经尝试用{margin：auto;保证金：汽车;宽度：1000px; }，这并没有工作小部件仍然堆栈 我也尝试将相对/绝对定位到小部件项目本身，而包装没有成功。我认为它与

float: left; 

关于窗口小部件项目，但我不能看到一个方法呢？希望有人能指引我走向正确的方向！

在此先感谢，我下面的部件条目CSS低于

/* Footer Widget Areas */ 
#supplementary { 
border-top: none; 
width: 80%; 
padding: 1.625em 7.6%; 
overflow: hidden; 
} 

/* Three Footer Widget Areas */ 
#supplementary.two .widget-area { 
float: left; 
margin-right: 2.7%; 
width: 17.78%; 
} 
#supplementary.two .widget-area + .widget-area { 
margin-right: 0; 
} 

/* Three Footer Widget Areas */ 
#supplementary.three .widget-area { 
float: left; 
margin-right: 2.7%; 
width: 22.18%; 
} 
#supplementary.three .widget-area + .widget-area + .widget-area { 
margin-right: 0; 
} 

#supplementary.four .widget-area{ 
float: left; 
margin-right: 3.7%; 
width: 22.18%; 
} 

#supplementary.four .widget-area + .widget-area + .widget-area { 
margin-right: 0; 
} 

#supplementary.five .widget-area{ 
float: left; 
margin-right: 2.9%; 
width: 16.7%; 
} 

#supplementary.five .widget-area + .widget-area + .widget-area + .widget-area + .widget-area+ .widget-area{ 
margin-right: 0; 
} 

Answer 1

这不是一个错误。这是由设计。 WordPress 2011是一款responsive主题，旨在让任何尺寸的设备看起来不错。较小的设备没有空间在主要内容旁边呈现小部件，因此，该主题与大多数其他响应式主题一起，将它们移动到小屏幕上的主要内容之下。

覆盖此功能看起来非常不直观。如果你真的不想要一个响应式设计（并且在这个年龄段，你应该想要一个），那么你应该选择一个不响应的父主题。

Answer 2

第一件事关我看到了蝙蝠的是，这行代码

站点包装{保证金：汽车;保证金：汽车; width：1000px;}

需要是

site-wrapper {margin：0 auto;宽度：1000像素;}

接下来的事情，试图用整个百分比，浏览器不喜欢的部分，而是他们往往圆...尝试调整宽度为整数，其总和等于或小于100