Iframe rutscht im IE unter Navileiste
0 0 0 
at
Iframe rutscht im IE unter Navileiste
Ich habe ein Problem bei der Darstellung mit Internet Explorer.
Ich habe ein zweispaltiges Layout. Links ein Menü mit float: left und rechts der Inhalt mit einem Iframe. Im Internet Explorer wird der Iframe erst unterhalb des Menüs dargestellt, was bei langen Navigationsmenüs dann doch weh tut.
CSS-Code:
ul#Navigation {
float: left; width: 22em;
}
ul#Navigation li {
list-style: none;
margin: 0; padding: 0.5em;
}
ul#Navigation a {
display: block;
}
div#Inhalt {
margin-left: 22em;
min-width: 16em;
}
Ausschnitt html-Code:
<ul id="Navigation">
<li><a href="Test.html">Seite 1</a></li>
</ul>
<div id="Inhalt">
<iframe src="Test.html" width="90%" height="400">
</iframe>
</div>
Sehen kann man es hier: http://html2.ag.vu/Test.html
Vorab vielen Dank.
Gruß, Fetz
-
Hallo,
Ich habe ein Problem bei der Darstellung mit Internet Explorer.
Ich habe ein zweispaltiges Layout. Links ein Menü mit float: left und rechts der Inhalt mit einem Iframe. Im Internet Explorer wird der Iframe erst unterhalb des Menüs dargestellt, was bei langen Navigationsmenüs dann doch weh tut.CSS-Code:
ul#Navigation {
float: left; width: 22em;
}
ul#Navigation li {
list-style: none;
margin: 0; padding: 0.5em;
}
ul#Navigation a {
display: block;
}div#Inhalt {
margin-left: 22em;
min-width: 16em;
}Ausschnitt html-Code:
<ul id="Navigation">
<li><a href="Test.html">Seite 1</a></li>
</ul><div id="Inhalt">
<iframe src="Test.html" width="90%" height="400">
</iframe>
</div>Sehen kann man es hier: http://html2.ag.vu/Test.html
Der IE hat Probleme mir dem Rendern von Blockboxen neben gefloateten Elementen, wenn diese Blockboxen keine Höhenangabe haben. Daher kommen einige der bekannten Bugs im IE.
Gib mal dem div#Inhalt eine background-color:red;, dann siehst Du einen weiteren lustigen Bug.
Gib dann dem div#Inhalt eine height:100%. Das ist zwar völliger Unsinn, weil die 100% gar keine Bezugsgröße haben, es reicht aber, um die Bugs zu umgehen.
Die Breite des IFRAMES und ggf auch das margin-left des div#Inhalt musst Du dann eventuell speziell für den IE anders setzen als für standardkonforme Browser. Hierzu bieten sich Conditional Comments an, wie in http://de.selfhtml.org/css/layouts/browserweichen.htm#alternative beschrieben.
viele Grüße
Axel
-
Hallo Axel,
herzlichen Dank für die guten Tipps. Hat prima gelappt.
Gruß, Fetz
-
Hallo.
Hat prima gelappt.
Das heißt "überlappt".
MfG, at
-
-