2017-01-01 4 views
0

Ich versuche, eine Reihe von div-Tags angezeigt werden (oder Tags) in Folge die ganze Zeile zu füllen und in der nächsten Zeile zu wickeln und so weiter. Wenn ich mein Fenster verkleinere, sollten sie sich anpassen und ich würde weniger Elemente pro Zeile und mehr Zeilen zum Scrollen haben. Das Ganze würde irgendwie wie ein Tisch aussehen. Ich habe dies in .NET mit dem nativen Flow-Layout-Steuerelement von Windows gemacht. Irgendwelche Ideen, wie man das in HTML5 mit Bootstrap macht? Ich laufe auf Angular 2. Es wird großartig sein, wenn ich die Größe der divs angeben kann, um sie ausgerichtet zu halten, aber es ist nicht notwendig, in welchem ​​Fall sie zum Inhalt passen.HTML5 Bootstrap Fluss-Layout

Danke.

Antwort

0

Was Sie suchen ist die Bootstrap Grid-System. http://www.w3schools.com/bootstrap/bootstrap_grid_system.asp

So zum Beispiel auf einem großen Bildschirm, wird es drei Elemente in einer Reihe. Auf einem kleineren Bildschirm wird es zwei sein.

<div class="col-md-12"> 
    <span class="col-md-4 col-xs-6">1 </span> 
    <span class="col-md-4 col-xs-6"> 2</span> 
    <span class="col-md-4 col-xs-6"> 3</span> 
    <span class="col-md-4 col-xs-6"> 4</span> 
    <span class="col-md-4 col-xs-6"> 55</span> 
    <span class="col-md-4 col-xs-6"> 6</span> 
</div> 

bestellen hier http://codepen.io/anon/pen/pRzLav

in Aktion aus