Warum umschließt mein Äußeres mein Inneres bei der Größenänderung des Fensters nicht vollständig?-CSS-Tutorial-php.cn

Why Doesn't My Outer `` Fully Enclose My Inner `` on Window Resize?

Warum funktioniert das äußere

Das innere

kann nicht vollständig umschlossen werden. Wenn das Fenster schmaler wird?

Dieses Problem entsteht durch die Interaktion zwischen verschiedenen CSS-Eigenschaften und den Anzeigeeinstellungen des Elements. Standardmäßig werden Elemente auf Blockebene wie

erweitert, um die verfügbare Breite ihres enthaltenden Blocks auszufüllen. In diesem Fall ist das äußere

ist ein Element auf Blockebene innerhalb eines umfassenderen umschließenden Blocks.

Um zu verhindern, dass das äußere

nicht unter die Breite des inneren

schrumpft, kann eine Kombination aus Inline-Block- und Min-Width-Eigenschaften verwendet werden. Hier ist die Erklärung:

inline-block: Dieser Anzeigewert ermöglicht es einem Element, sich wie ein Inline-Element zu verhalten, während die Möglichkeit erhalten bleibt, bestimmte Breite und Höhe zu definieren. Dadurch wird verhindert, dass das Element in eine neue Zeile umbricht, und es bleibt in seinem übergeordneten Element enthalten.
Mindestbreite: 100 %: Durch Festlegen der Mindestbreite des äußeren von der Flucht über die Grenzen des äußeren
wenn das Fenster kleiner wird.

Durch die Integration der Inline-Block-Anzeige und der Mindestbreite können wir das äußere

um die Breite des inneren

unter Beibehaltung seines Verhaltens auf Blockebene.

Das obige ist der detaillierte Inhalt vonWarum umschließt mein Äußeres mein Inneres bei der Größenänderung des Fensters nicht vollständig?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Vorheriger Artikel：Wie verhindert man die Verschiebung von Inline-Elementen bei fettem Hover? Nächster Artikel：Wie integriere ich benutzerdefinierte Schriftarten in HTML ohne Flash oder PHP?

Erklärung dieser Website

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

Neueste Artikel des Autors

Aktuelle Ausgaben

function_exists() kann die benutzerdefinierte Funktion nicht ermitteln Funktionstest () {Verwendung der Verwendung durch -Durch -Durch -Durch -Durch -Durch -Durc...

Aus 2024-04-29 11:01:01

2818

So zeigen Sie die mobile Version von Google Chrome an Hallo Lehrer, wie kann ich Google Chrome in eine mobile Version umwandeln?

Aus 2024-04-23 00:22:19

2942

Das untergeordnete Fenster bedient das übergeordnete Fenster, aber die Ausgabe antwortet nicht. Die ersten beiden Sätze sind ausführbar, der letzte Satz jedoch nicht.

Aus 2024-04-19 15:37:47

2462

Im übergeordneten Fenster erfolgt keine Ausgabe document.onclick = function(){ window.opener.document.write('Ich bin die Ausgabe des unter...