Heim  >  Artikel  >  Web-Frontend  >  Warum funktioniert meine CSS-Höhe in Prozent nicht?

Warum funktioniert meine CSS-Höhe in Prozent nicht?

Barbara Streisand
Barbara StreisandOriginal
2024-11-23 06:42:12690Durchsuche

Why Isn't My CSS Height in Percent Working?

CSS-Höhe funktioniert nicht in Prozent: Ein gelöstes Problem

Wenn Sie die Höhe eines Elements auf 100 % festlegen, wird erwartet, dass es die Höhe einnimmt Es kann jedoch frustrierend sein, dieses Verhalten nicht zu bemerken. Das Problem entsteht, weil auch die Vorfahren des Elements eine definierte Höhe haben müssen.

Um dieses Problem zu beheben, weisen Sie allen übergeordneten Elementen eine Höhe von 100 % zu. Im bereitgestellten Beispiel:

<div>

die Höhen der übergeordneten Elemente html und body müssen ebenfalls auf 100 % gesetzt sein:

html, body { height: 100%; width: 100%; margin: 0; }

Indem sichergestellt wird, dass alle Vorgängerelemente bestimmte Höhen haben , nimmt das untergeordnete Element div ordnungsgemäß die gesamte Höhe seines Containers ein. Dies liegt daran, dass seine Höhe relativ zum enthaltenden Element ist und ohne eine definierte Höhe für dieses Element nicht eindeutig ist, was 100 % darstellt.

Das obige ist der detaillierte Inhalt vonWarum funktioniert meine CSS-Höhe in Prozent nicht?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn