CSS宽度:继承问题

Question

我有一个有小部件的wordpress网站。http://www.insidemarketblog.com/seo/bestseotoolstoimproverankings/

如果你向下滚动，你会注意到“你想要增长你的业务”这个方框和你一起滚动(固定位置)。

文本框调整大小，导致文本离开边栏空间的奇怪问题。css是内联的宽度:继承。如果文本是从上述空格继承的，为什么它会中断呢？

HTML/CSS：

<form class="thesis_email_form" action="http://insidemarketstrategy.us8.list-manage.com/subscribe/post" method="post">
<div id="text-4_clone" class="widget widget_text q2w3-widget-clone-thesis_wp_widgets_1348079687" style="top: 0px; width: inherit; height: 289px; visibility: hidden;">  </div>
<div id="text-4" class="widget widget_text" style="position: fixed; top: 0px; width: inherit;">
<p class="widget_title">Are you looking to grow your business?</p>
<div class="textwidget">
<div id="wpcf7-f94-o1" class="wpcf7">
<div class="screen-reader-response"></div>
<form class="wpcf7-form" novalidate="novalidate" method="post" action="/seo/bestseotoolstoimproverankings/#wpcf7-f94-o1">
<div style="display: none;">
<p>
<p>
<p>
<p>
<div class="wpcf7-response-output wpcf7-display-none"></div>
</form>

Answer 1

边栏使用填充边框来创建沟槽~意味着填充被计算为宽度的一部分，即328，尽管边栏的宽度似乎是278。

在继承宽度之后，需要328，而不是278，最好的解决方案是将填充更改为这样的边距&将宽度缩小到278。

 .columns > .sidebar {
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;
     float: right;
     margin: 25px 25px 0;
     width: 278px;
 }

只需将此代码替换为css.css中的在线编号98的代码即可。