2

我知道足夠的CSS是危險的,並且使用Twitter Bootstrap的流體網格與IE6和IE7打了一圈牆。有人能幫助我理解我做錯了什麼嗎?我在這裏和其他地方嘗試了一些建議,但不斷空虛。Twitter在ie6和ie7中溢出的Bootstrap內容

因爲我想在我的兩列文本之間添加空格,所以我使用填充創建了兩個.inner類。這在除了IE6和IE7之外的所有內容中都很有用,其中.span4內容溢出容器。

content overflows its container in IE7

有人可以幫助我瞭解此填充問題的根源,我需要做什麼?非常感謝!

#main {padding: 0 5% 3% 5%;} 
.inner-left {padding-right: 5%;} 
.inner-right {padding-left: 2%;} 


<div id="content" class="fluid-row"> 
<div id="main" class="span12" role="main"> 
<div class="row-fluid"> 
    <div class="span8"> 
     <div class="inner-left"> 
      <p>text</p> 
     </div> 
    </div> 

    <div class="span4"> 
     <div class="inner-right"> 
     <p>text</p> 
     </div> 
    </div> 
</div> 
</div> 
</div> 
+2

可能你的一些截圖的幫助下進一步闡述了什麼你試圖達到目前的事情看起來很好.. –

+0

@RishiKalia,因爲這是我在Stackoverflow上的第一篇文章,它不會讓我上傳截圖。但是,隨着您的評論,我的聲譽躍升到足以讓我上傳。謝謝! – sticklechick

+0

您可以試試[bsie](http://ddouble.github.com/bsie/)Bootstrap IE6兼容庫:[http://ddouble.github.com/bsie/](http://ddouble.github .com/bsie /) – 2012-12-12 05:21:17

回答

1

你可以用這個代替代碼:

<div class="inner-right" style="margin-right:70px"> 
<blockquote><p>What do you plan to do with your one wild and precious life?</p> 
<p><small>Mary Oliver</small></p></blockquote> 
</div> 

,或者您可以編輯您的app.css如下:

.inner-right { 
padding-left: 2%; 
margin-right:70px; 
} 
+0

感謝您將我的注意力引向正確的利潤空間!這是一個巨大的幫助。我最終使用*技巧瞄準了IE7。將修改與我最終做了什麼的答案。謝謝你,謝謝你,謝謝你。 – sticklechick

+0

@sticklechick我也建議讓它成爲公認的答案。 – corsiKa