Warum funktionieren meine Inline-Block-Elemente nicht in Internet Explorer 6 und 7?

Inline-Block-Elemente in Internet Explorer 6 und 7 funktionieren lassen

F: Ich verwende Inline-Block-Elemente in meinem CSS-Code , aber sie funktionieren in Internet Explorer 6 und 7 nicht richtig. Was mache ich? falsch?

</p>
<h1>signup {</h1>
<p>color:#FFF;<br> border-bottom:solid 1px #444;<br> text-transform: Großbuchstaben;<br> text-align:center;<br>}</p>
<h1>Anmelden #left {</h1>
<p>display: inline-block<br>}</p>
<h1>signup #right {</h1>
<p>background-image:url(images/signup.jpg);<br> Rand links: durchgehend 1 Pixel #000;<br> Rand rechts: durchgehend 1 Pixel #000;<br> Anzeige: Inline-Block; <br> padding:1% 2%<br> width:16%;<br>}</p>
<h1>signup #right a { font-size:100%; Schriftgröße: Bold }</h1>
<h1>signup #right p { Schriftgröße:90 %; font-weight:bold }</h1>
<h1>signup a:hover { color:#FFF; text-decoration:underline }</h1>
<p>

A: In Internet Explorer 6 und 7 funktioniert inline-block nur bei natürlich inline-Elementen wie Spans. Damit es bei anderen Elementen wie Divs funktioniert, benötigen Sie Folgendes:

</p>
<h1>yourElement {</h1>
<pre class="brush:php;toolbar:false">display: inline-block;
*display: inline;
zoom: 1;

}

• *display: inline ist ein CSS-Hack speziell für IE7 und unten.
• Zoom: 1 stellt sicher, dass das Element ein Layout hat, was eine Voraussetzung dafür ist, dass der Inline-Block funktioniert.

Diese Problemumgehung lässt sich zwar mit gültigem CSS implementieren, ist es aber Dies wird nicht empfohlen, insbesondere wenn Sie bereits Eigenschaften mit Herstellerpräfixen verwenden. Weitere Informationen zum Inline-Block finden Sie in dieser Ressource.

Das obige ist der detaillierte Inhalt vonWarum funktionieren meine Inline-Block-Elemente nicht in Internet Explorer 6 und 7?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!