Warum funktioniert meine CSS-Eigenschaft „top: 50 %' nicht?

CSS-Top-Prozent-Eigenschaft funktioniert nicht

Beim Versuch, ein responsives CSS-Layout zu implementieren, wird festgestellt, dass die Eigenschaft „Top: 50 %“ nicht wie vorgesehen funktioniert , während die Eigenschaft „links: 50 %“ funktioniert. Dieses Problem tritt auf, weil die Eigenschaft „oben“ ein übergeordnetes Referenzelement mit einer definierten Höhe erfordert.

<div>

Um dieses Problem zu beheben, gibt es zwei mögliche Lösungen:

1. Definieren Sie eine Dimension für den übergeordneten Container:

   Geben Sie eine bestimmte Höhe und Breite für den übergeordneten Container an und stellen Sie sicher, dass er über eine definierte Fläche verfügt damit das untergeordnete Element positioniert werden kann.

   <div>

   Nach dem Login kopieren

   Nach dem Login kopieren

   Nach dem Login kopieren

2. Strecken Sie den übergeordneten Container:

   Alternativ kann der übergeordnete Container mithilfe von gestreckt werden Eigenschaften „oben“, „unten“, „links“ und „rechts“. Dadurch erhält das untergeordnete Element einen Referenzbereich für seine „obere“ Positionierung.

   <div>

   Nach dem Login kopieren

   Nach dem Login kopieren

   Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonWarum funktioniert meine CSS-Eigenschaft „top: 50 %' nicht?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!