Ich versuche, ein Bild in einem Div vertikal auszurichten, aber alles, was ich versuche, wird nicht funktionieren.Wie wird das Bild vertikal ausgerichtet?
Ich versuche, es in einer material design lite Zelle zu zentrieren.
Hier ist mein Code:
HTML:
<div class="mdl-grid">
<div class="mdl-cell mdl-cell--4-col">
a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>
</div>
<div class="mdl-cell mdl-cell--4-col">
<div class="imgholder">
<img src="http://i.stack.imgur.com/kq8EX.png" id="stackimg">
</div>
</div>
</div>
CSS:
.mdl-cell{
border: 1px solid black;
}
.imgholder{
width: 100%;
height:100%;
}
#stackimg{
width:50%;
float: right;
position: reletive;
top:50%;
vertical-align: middle;
}
Vertical-align: middle
macht nichts. Weder ist top: 50%
. Das Bild hat ein Eltern-Div mit einer definierten Höhe, also bin ich mir nicht sicher, warum es nicht funktioniert.
Jede Hilfe wird geschätzt.
es wird nicht Ihr Problem beheben, aber das macht Ihre Rechtschreibung - relativ, nicht – kinakuta
reletive Ein großer Führer für in CSS Zentrierung sollte fix alle Ihre Probleme: https://css-tricks.com/centring-css-complete-guide/ –
Position muss fest oder absolut sein, um 'top' zu verwenden. –