2009-07-14 57 views
2
<div style="overflow:hidden; height:100px; width:100px;"> 
<img src="etc.jpg" width:"100px" /></div> 

Ich habe ein img in eine div bekam. Die Höhe des img ist nicht definiert, aber es ist größer als die 100px des div.Vertikale Ausrichtung Bild mit Überlauf Zentrieren: versteckt

Ich möchte die img vertikal zentrieren und den oberen und unteren Überlauf ausblenden.

Noch kann ich nicht verstehen, wie dieses ...

Daniele

Antwort

-1

Funktioniert das für Sie?

<div style="overflow:hidden; height:100px; width:100px;"> 
    <image src="etc.jpg" style="width:100px; position: relative; bottom: 25%;" /> 
</div> 

Hmmm das Ergebnis ist ein bisschen komisch, wenn das Bild paßt

+0

das funktioniert gut ... danke! –

+1

Dies funktioniert nur, wenn die Höhe des Bildes 100px ist. Andernfalls wird es nicht ordnungsgemäß ausgerichtet, da der Prozentsatz anhand der Eigenschaft des übergeordneten Elements bewertet wird. – dionyziz

0

Sie versuchen zu tun, können die margin-top-Eigenschaft des Bildes auf einem negativen Prozentsatz einzustellen. Beispielsweise;

div img {margin-top: -50%;} 

Nur mit den Prozentwerten spielen, und Sie sollten etwas finden, das funktioniert.

+0

Die negative Marge auf der Höhe des Bildes basieren soll. In diesem Abschnitt wird der Prozentsatz jedoch auf die Höhe des übergeordneten Elements angewendet, was nicht hilfreich ist. Wenn Sie den Prozentsatz anpassen, wird das Problem nur für ein bestimmtes Bild behoben, dessen Höhe konstant ist, nicht für ein Bild. – dionyziz