Wie zentriert man ein Element vertikal innerhalb eines anderen Elements, das 100% Höhe hat?

Question

Wie zentriert man ein Element vertikal innerhalb eines anderen Elements, das 100% Höhe hat?

8

Ich habe diese Technik Ссылка verwendet. Und es ist fast gut - aber in der zweiten Box kann man sehen, dass die Inhaltsbox aus dem äußeren Element herausragt.

Wie behebt man das, wenn das innere Element kleiner ist als das äußere, wird es zentriert und wenn es höher ist, schiebt es das äußere Element wie in diesem Bild?

html css

Mike Baza 03.11.2013, 13:55

quelle

4 Antworten

Tags und Links html css

Django: Verwenden von Annotate, Count und Distinct in einem Queryset Was bedeutet PicturePileLayerContent (...): Warnung: PicturePile ohne Inhalt malen

score 1 · Answer 1

1

Sie müssen drei Haupteigenschaften angeben, um vertikal auszurichten

Höhe: ...;
Anzeige: Tabellenzelle;
vertikale Ausrichtung: Mitte;

Dev 26.12.2013 13:40

quelle

score 0 · Answer 2

0

Ändern Sie in Ihrem zweiten Feld diese Zeile:

%Vor%

für diesen:

%Vor%

Nelson 03.11.2013 14:06

quelle

score 0 · Answer 3

0

in Ihrem CSS

%Vor%

Fly-Project 03.11.2013 14:21

quelle

score 0 · Answer 4

Dies scheint das zu sein, was Sie beschreiben . (Das zweite Beispiel in der Demo)

Um das zu beheben, fügen Sie display:table; und width: 100% zum Blockelement (Elternelement)

hinzu

AKTUALISIERTER FIDDLE

Markup

%Vor%

CSS

%Vor%

Wenn Sie Beispiele sehen möchten, in denen das Blockelement 100% der Höhe des Darstellungsbereichs einnimmt, sehen Sie sich Folgendes an: vor ... nach