So wie ihr ja schon wisst, mach ich gerade eine Homepage. Diese war ja auch schon fast fertig, aber ein paar Divs haben noch gefehlt. Die hab ich soweit auch eingefügt. Die Homepage sah nach diesen Divs so aus:
http://projektpfinz.pr.ohost.de/Test/Untitled-1.html
In allen beiden Browsern eigentlich mehr oder weniger normal (allerdings muss ich noch den min height trick für den IE einfügen; aber egal)
Anmerkung: Hab beim iframe dei HP geändert, damit man scrollen muss und es sieht.
Dann allerdings fiel mir ein, dass ich noch ein kleines Div überhalb des Iframes brauche. Soweit so gut: Dies hat auch gut geklappt und das Div ist in beiden Browsern richtig platziert. Im IE funktioniert alles so wie in Beispiel 1 (insbesondere das Scrollen des iframes), im FireFox allerdings färbt sich der Iframe schwarz wenn man nach unten scrollen will. Das Schwarze verschwindet erst wieder wenn man mit der Maus drüberfährt oder wie wild darauf rumklickt. Das Ergebnis könnt ihr hier sehn:
http://projektpfinz.pr.ohost.de/Test/Untitled-2.html
Ich hab natürlich nach dem Grund gescucht und mir fiel auf, dass sobald ich das Div überhalb des Iframes löschte, der Iframe im FF normal war (siehe Bsp. 1)
Das CSS Dokument ist bei beiden Seiten gleich: (Das fett markierte Element wurde aufgrund des zusätzlichen Divs eingefügt)
Der Quellcode der beiden Seiten ist auch identisch außer dem zusätzlich eingefügten Div (fett markiert):
Was hab ich falsch gemacht bei einfügen? Wie füge ich sonst ein Div überhalb des Ifgrames ein, bzw. was muss ich am CSS Code ändern?
http://projektpfinz.pr.ohost.de/Test/Untitled-1.html
In allen beiden Browsern eigentlich mehr oder weniger normal (allerdings muss ich noch den min height trick für den IE einfügen; aber egal)
Anmerkung: Hab beim iframe dei HP geändert, damit man scrollen muss und es sieht.
Dann allerdings fiel mir ein, dass ich noch ein kleines Div überhalb des Iframes brauche. Soweit so gut: Dies hat auch gut geklappt und das Div ist in beiden Browsern richtig platziert. Im IE funktioniert alles so wie in Beispiel 1 (insbesondere das Scrollen des iframes), im FireFox allerdings färbt sich der Iframe schwarz wenn man nach unten scrollen will. Das Schwarze verschwindet erst wieder wenn man mit der Maus drüberfährt oder wie wild darauf rumklickt. Das Ergebnis könnt ihr hier sehn:
http://projektpfinz.pr.ohost.de/Test/Untitled-2.html
Ich hab natürlich nach dem Grund gescucht und mir fiel auf, dass sobald ich das Div überhalb des Iframes löschte, der Iframe im FF normal war (siehe Bsp. 1)
Das CSS Dokument ist bei beiden Seiten gleich: (Das fett markierte Element wurde aufgrund des zusätzlichen Divs eingefügt)
Code:
@charset "utf-8";
html {
height:100%;
max-height:100%;
padding:0;
margin:0;
border:0;
}
body {
height:100%;
max-height:100%;
padding:0;
margin:0;
border:0;
text-align:center;
background-image: url(../background.jpg);
background-color: #82C4F6;
background-repeat: repeat-x;
}
#head {
position:absolute;
left:0;
top:0;
width:960px;
min-width:960px;
height:150px;
z-index:5;
}
#Flash {
float: left;
height: 150px;
width: 900px;
margin-left: 30px;
border: 0;
}
* html #maincontent {
top:0;
bottom:0;
height:100%;
border-top:150px solid #fff;
border-bottom:30px solid #fff;
}
#maincontent {
display:block;
overflow:hidden;
position:absolute;
z-index:3;
top:150px;
bottom:30px;
width:960px;
left:0;
background:url(../pfad/zur/grafik.gif) repeat-y;
}
#maincontent #content {
width:297px;
height:100%;
float:left;
display:inline;
margin-left:39px;
background:#ccc;
}
#maincontenttop {
width:585px;
height:30px;
float:right;
display:inline;
margin-right:39px;
border:0;
}
#maincontent iframe {
width:585px;
height:100%;
float:right;
display:inline;
margin-right:39px;
border:0;
overflow-x:hidden; /*waagrechter Scrollbalken deaktiviert; nicht im IE6-*/
}
#foot {
position:absolute;
left:0;
bottom:0;
width:960px;
min-width:960px;
height:30px;
z-index:5;
background-color: #000000;
}
#wrap {
width:960px;
position:relative;
margin:0 auto;
min-height:500px;
height:100%;
text-align:left;
background-color: #FFFFFF;
}Der Quellcode der beiden Seiten ist auch identisch außer dem zusätzlich eingefügten Div (fett markiert):
Code:
[...]
<style type="text/css">
</style>
<link href="CSS/screen.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="wrap">
<div id="head">
<div id="Flash"></div>
</div>
<!--End head-->
<div id="maincontent">
<div id="content">content</div>
<div id="maincontenttop"></div>
<iframe src="http://www.gmx.de" frameborder="0">Bitte aktivieren Sie Frames, damit diese Seite richtig dargestellt werden kann</iframe>
</div>
<!--End maincontent-->
<div id="foot">foot</div>
</div>
<!--End wrap-->
</body>
[...]Was hab ich falsch gemacht bei einfügen? Wie füge ich sonst ein Div überhalb des Ifgrames ein, bzw. was muss ich am CSS Code ändern?
