CSS - 响应问题

我会尽量简化。您可以在http://www.insidemarketblog.com处看到问题（您可以在调整大小时看到问题）CSS - 响应问题

当您调整页面大小以使侧边栏元素进入底部时（只要边栏进入底部），您会注意到电子邮件带有蓝色标题的表单显示“发展您的业务”浮动到右侧，不会调整为100％。我怎样才能解决它浮动到左侧，并调整到100％？

下面是代码：

HTML：

<div id="text-2" class="widget widget_text" style=""> 
<p class="widget_title">Grow Your Business</p> 
<div class="textwidget"> 
<div id="wpcf7-f94-o1" class="wpcf7"> 
<form class="wpcf7-form" novalidate="novalidate" method="post" action="/#wpcf7-f94-o1"> 
</div> 
</div> 
</div>

这里是把所有相关的CSS代码我的最好的尝试（但B/C它的响应CSS这可能是不完整的

.columns > .sidebar > *:nth-child(2n+2) { 
    clear: none; 
    float: right; 
} 
.columns > .sidebar > * { 
    width: 240px; 
} 
.columns > .sidebar > * { 
    clear: both; 
    float: left; 
    width: 46.15%; 
}

下面是它的外观截图（为什么这显然是错误的）。

enter image description here

来源

2014-03-29 user3117275

我不认为这是反应... – bjb568

@mdesdev http://www.insidemarketblog.com/wp-content/thesis/skins/pearsonified/css.css – bjb568

添加到您的代码：

@media (max-width: 984px){ 
    .columns > .sidebar > * { 
     clear: both; 
     float: left; 
     width: 100%; 
    } 
}

来源

2014-03-29 18:05:08

这工作完美 - 谢谢！ – user3117275

这真是太棒了。 –

为什么downvote ??? –

你的CSS说它应该漂浮在右边，所以它完全按照代码说的。在您发布的CSS中查看您的第三行：您应该在响应式布局中删除#text-3和#text-2的浮动，它将起作用。

来源

2014-03-29 18:03:36 KittMedia

CSS - 响应问题

回答

相关问题