Wie man Linie in einem div bricht?

Question

Ich habe eine div, die eine Menge div s in einer Zeile enthält. Ich möchte es so, dass, wenn es zu viele div s auf der Linie sind, die anderen div s in einer neuen Zeile angezeigt werden. Das Problem kann in diesem Bild zu sehen:

Answer 1

Sie die inline-block CSS-Eigenschaft verwenden können:

.box2 { 
    display: inline-block; 
    width: 200px; 
    height: 100px; 
    margin: 1em; 
} 

mehr über diese Eigenschaft, lesen Sie hier: Inline-Block - LearnLayout

Answer 2

Eine Möglichkeit ist Flexbox zu verwenden mit diesen Einstellungen für Ihr Containerelement:

.wrapper { 
    display: flex: 
    justify-content: flex-start; 
    flex-wrap: wrap; 
}