Spalten mit gleicher Höhe - CSS

-1

Ich habe ein äußeres div-Element, das viele innere div-Elemente enthält. Ich möchte erreichen, dass die Inner-Divs auf jeder Fenstergröße die gleiche Höhe haben.Spalten mit gleicher Höhe - CSS

Wenn ich display: flex; auf dem Outer-Div verwenden, ist das Problem, dass alle Inner-Divs auf einer Zeile kommen. Es sollte fünf divs hintereinander geben und wenn das Fenster kleiner wird, sollten sie nach unten fließen. Hier

ist ein JSFiddle: https://jsfiddle.net/k7oLbqj1/5/

ich dieses Problem nur mit CSS lösen. Ich hoffe, dass mir jemand helfen kann.

Vielen Dank im Voraus!

Quelle

2017-05-12 dahlsdata-tahira

flex + flex-wrap es in Linien brechen tun. display: grid hilft dabei, col und rows sams größe zu halten und eventuell spalten col oder rows oder beides zu erlauben. kannst du deinen Code auch hier teilen? –

ein Raster Beispiel von meinem früheren Kommentar: https://jsfiddle.net/k7oLbqj1/7/ –

Verwenden flex-wrap: wrap; mit display: flex; auf .outer und geben Breite auf .inner

.outer { 
    display: flex; 
    flex-wrap: wrap; 
} 

.inner { 
    background: #fff; 
    border: 1px solid #000; 
    padding: 10px; 
    margin-bottom: 20px; 
    width:20%; 
    text-align: left; 
    box-sizing: border-box; 
}

https://jsfiddle.net/k7oLbqj1/6/

Quelle

2017-05-12 10:22:38

Spalten mit gleicher Höhe - CSS

Antwort

Verwandte Themen