2014-04-15 35 views
1

我的問題類似於stackoverflow.com question23013069除了我有控制的HTML。第1行有(A)col-sm-7和一個塊div,(B)col-sm-5有文本。第2行有(C)col-sm-7和一個塊div。頁面在md和lg大小上看起來不錯,但是在較小的sm大小中,B的擴展文本在A和C之間創建了一個空隙。是否有辦法消除這個空隙並使C上浮?我不想將A和C移動到一列中的嵌入行,因爲我希望移動大小以A,B,C順序堆疊。 example有沒有辦法讓一個div上浮到twitter空間中的引導3

<body> 
<div class="container"> 
    <div class="row"> 
    <div class="col-sm-7"> 
     <div style="max-width:500px;height:200px;border:thick solid blue;"></div> 
    </div> 
    <div class="col-sm-5"> 
     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas enim 
     lacus, luctus a urna ut, euismod tempus justo. Nulla elementum quis dui 
     at rutrum. Donec luctus eros et gravida pulvinar. Fusce facilisis purus 
     ac odio auctor, eget sollicitudin urna malesuada. Curabitur sollicitudin 
     vitae neque non placerat.</p> 
     <p>Suspendisse pharetra quis nisl a sollicitudin. Aliquam vel iaculis ipsum, 
     vel ultrices leo. Nullam nec laoreet odio. Mauris non auctor justo. Quisque 
     sit amet malesuada ante. Sed at metus tellus. Ut auctor cursus lacinia. 
     Integer tempor sed mi ut ornare.</p> 

    </div> 
    </div> 
    <div class="row"> 
    <div class="col-sm-7"> 
     <div style="max-width:500px;height:200px;border:thick solid red;"></div> 
    </div> 
    </div> 
</div> 
</body> 
+0

如果您想獲得更具體的幫助,請創建小提琴。 http://jsfiddle.net – isherwood

回答

0

您可以1)克隆使用元素和顯示/隱藏工具類,或2)使用媒體查詢CSS語句來給該元素負邊距把它拉起來。

+0

謝謝。我用你的第二個解決方案,它完全解決了我的問題。我沒有足夠的積分來upvote。 – PamL

相關問題