DIV Container untereinander positionieren – CSS Befehl

Anleitung: So listet man DIV Container untereinander auf!

Wer mit DIV Containern arbeitet, verwendet diese oft um Inhalte sauber untereinander darzustellen! Gerade die DIVs bieten hier den großen Vorteil, dass die Abstände zum oberen Anzeige-Element auf das Pixel genau eingestellt werden können! Auch die Abstände nach links bzw. rechts können sauber parametrisiert werden!

Welche Parameter man hierzu verwenden kann, möchte ich Euch hier kurz zeigen!

Grundsätzlich würde ich Euch dabei empfehlen, den gesamten Inhalt in einen weiteren Container zu legen, welcher zur Basisausrichtung dient. In diesem könnt ihr dann die Untercontainer definieren!

Hier zuerst einmal der Code, wie man die DIVs einbindet:

 

<div class=”div-hauptcontainer”>

<div id=”div-container1”>
Inhalt
</div>

<div id=”div-container2”>
Inhalt
</div>

</div>

 

 

Hier das benötigte CSS File!

 

    .div-hauptcontainer {
margin: 10px 0 0 10px;
width:100%;
float: left;

}

#ldiv-container1 {
float: both;
margin-left: 0px;
margin-top: 0px;
}

#div-container2 {
float: both;
margin-left: 0px;
margin-top: 0px;
}

 

Viel Erfolg bei der Umsetzung!

Übrigens!! Wie man einen DIV Container zentrieren kann, habe ich hier schon einmal gepostet!