web-dev-qa-db-de.com

Div mit CSS nach unten verschieben

Ich bin neu in CSS und möchte einen div-Bereich nach unten verschieben (siehe untenstehendes Bild):

enter image description here

Wie mache ich den div.title "nach unten schweben", damit er sich ordentlich in der unteren linken Ecke des Hauptdivs (aquafarbener Kasten) einfügt.

Ich habe versucht, vertikal auszurichten, aber es funktioniert nicht.

8
viv_acious

Margin-Top geben

div{margin-top:10px;}
17
Akhil Thesiya

Sie könnten Ihren blauen divposition: relative erstellen und dann den div.titleposition:absolute; und bottom: 0px angeben. 

Hier ist eine funktionierende Demo .. http://jsfiddle.net/gLaG6/

7
TryingToImprove

Eine Standardbreite für eine 16px-Standardschriftart beträgt 4px.

Quelle: http://jkorpela.fi/styles/spaces.html

0
Wylliam Judd

Ich sehe hier keine Erwähnung von Flexbox, deshalb werde ich illustrieren:

HTML

 <div class="wrapper">
   <div class="main">top</div>
   <div class="footer">bottom</div>
 </div>

CSS

 .wrapper {
   display: flex;
   flex-direction: column;
   min-height: 100vh;
  }
 .main {
   flex: 1;
 }
 .footer {
  flex: 0;
 }
0
agm1984