Versetzte vertikale Position von div Elementen innerhalb von Twitter Bootstrap

Question

Ich versuche, Offset-Elemente mit Twitter Bootstrap mit einem flüssigen Gitter richtig vertikal auszurichten. (Hinweis: Gitter ist auf 30 Spalten angepasst)

die roten Boxen In Anbetracht, ist dies die versuchte div Platzierung: http://imgur.com/IkB2G Dies ist die aktuelle Ist-Platzierung mit meinem Code: http://imgur.com/oJ2mG

Hier ist der Code ich verwende . Ich bin mir nicht sicher, wie ich die untere rote Box dazu bringen kann, sich nach den Bildern in den leeren Raum darüber zu bewegen.

<div class="container-fluid nomargin"> 
<div class="row-fluid span30 nomargin"><div style="height:10px"></div></div> <!-- Vertical spacing between menu and content--> 
<div class="row-fluid"> 
<div class="span4"></div> 
<div class="span16 white-box"> 
    <!--Body content--> 
    <div style="height:100px"></div> 
</div> 
<div class="span6 white-box"> 
    <!--Body content--> 
    <div style="height:300px"></div> 
</div> 

<div class="span16 white-box"> 
    <!--Body content--> 
    <div style="height:100px"></div> 
</div> 
</div> 

Answer 1

Sie müssen es als 2 Spalten betrachten, und in der linken Spalte haben Sie geschachtelte Zeilen. Aus dem Code, den Sie gepostet haben, kann ich die richtigen Größen nicht erkennen. Aber hoffentlich wird dir dieser Code etwas Inspiration geben.

<div class="row"> 
    <div class="span18"> 
     <div class="row"> 
      <div class="span18">This is a row on the left side.</div> 
     </div> 
     <div class="row"> 
      <div class="span18">This is a row on the left side.</div> 
     </div> 
    </div> 
    <div class="span12"> 
     This is the content on the right side. 
    </div> 
</div>