bootstrap流体网格：输入突破它的容器在ie7

为什么IE7输入突破了它的容器？bootstrap流体网格：输入突破它的容器在ie7

enter image description here

<div class="row-fluid" style="margin-top:10px;"> 
    <div class="span12"> 
     <div class="row-fluid"> 
      <div class="span6"> 
       <div class="row-fluid"> 
        <div class="span6 " style="background:green;"> 
         <input type="text" class="span12"> 
        </div> 
        <div class="span6" style="background:blue;"> 
         <input type="text" class="span12"> 
        </div> 
       </div> 
      </div> 
      <div class="span6"> 
       <div class="row-fluid"> 
        <div class="span6" style="background:green;"> 
         <input type="text" class="span12"> 
        </div> 
        <div class="span6" style="background:blue;"> 
         <input type="text" class="span12"> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div>

更新：我想它的盒子模型和宽度的问题，但与引导任何解决方案？

来源

2012-10-10 johnny

发生这种情况，因为IE7不支持认为填充和边界尺寸的元件的部分的宽度的CSS属性

box-sizing: border-box;

。

阅读更多有关该物业位置：http://paulirish.com/2012/box-sizing-border-box-ftw/

正因为如此，IE7添加填充和边框大小设置为输入宽度 - 超过母公司宽度。您必须将它们设置为0才能使元素适合父级大小并保持流畅。

您可以尝试在输入周围添加一个包装元素，然后将填充和边框设置为包装。这将适用于所有浏览器

来源

2012-10-10 09:42:38 Luca

yepp，谢谢，我希望它有这种开箱即用的某种魔术:) – johnny

嗯好老的IE7！我在我的答案中添加了一行，可以帮助您实现相同的结果:) – Luca

我有类似的问题。我用

class="input-mini"

更换

class="span3"

你可以使用过程中的输入小或任何诉讼解决它。既然你正在寻找你的输入span12，我会建议“input-xxlarge”

来源

2013-10-11 09:49:00 Robin

bootstrap流体网格：输入突破它的容器在ie7

回答

相关问题