nicht angemeldet
Bei den Browser Firefox und Oper haben Probleme mit der Anzeige der Background-Images im Body und in der Navigation.
Das BG-Bild passt sich der grösse des Browserfensters an. Die Naviationsbilder, habe Transparente bereiche...
IE zeigt alles richtig an: Wo ist der Fehler drin?
html:
<body>
<img id="bgImg" src="templates\seaplanet\images/bg_seaplanet.jpg" width="100%" height="100%">
<div id="bodyDiv">
<div class="header"><?php mosLoadComponent( "banners" );?> </div>
<div class="navi"><?php mosLoadModules ( 'left' ); ?></div>
<div class="main"><?php mosMainBody(); ?></div>
<div class="log"><?php mosLoadModules ( 'right' ); ?></div>
<div class="footer"><?php include_once('includes/footer.php'); ?></div>
</div>
</div>
</body>
css:
* { margin: 0;
padding: 0;}
/* Höhen- und Breitenanpassung zu 100%; Scrollbar ausblenden */
body, html{ width: 100%;
height: 100%;
overflow: hidden;}
/* BG-Image auf unterste Ebene anordnen */
#bgImg{ position: absolute;
top: 0;
left: 0;
border: 0;
z-index: 1;}
/* Body-Dummy absolut über BG-Image legen; Scrollbar bei Bedarf einblenden */
#bodyDiv{ position: absolute;
top: 0;
left: 0;
z-index: 2;
overflow: auto;
width: 100%;
height: 100%;
}
.navi {
font-family: Arial, Helvetica, sans-serif;
font-style: normal;
font-weight: bold;
font-variant: normal;
color: #999999;
left: 0%;
top: 28%;
height: 60%;
width: 20%;
border:none;
padding-left:1.5em;
padding-right:2em;
position:absolute;
vertical-align:middle;
}
.log {
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
left: 2%;
top: 95%;
height: 5%;
width: 5%;
position:absolute;
}
.main {
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;
color: #000066;
height:70%;
width:71%;
top: 25%;
left:25%;
overflow:auto;
border:none;
position:absolute;
padding-left:0.3em;
padding-right:0.3em;
scrollbar-base-color: #FFFFFF;
scrollbar-arrow-color: FFFFFF ;
scrollbar-DarkShadow-Color: #000066;
scrollbar-Highlight-Color: #FFFFFF;
}
.header {
font-family: Arial, Helvetica, sans-serif;
height: 10%;
width: 95%;
top:2%;
left:3%;
border:none;
position:absolute;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/banners/banner.png');
}
.footer {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
height: 2%;
top:98%;
width: 90%;
position:absolute;
border:none;
}
a.mainlevel:link {
font-family:Arial, Helvetica, sans-serif;
font-size:1em;
font-weight:bold;
padding-top:18px;
color:#FF00CC;
text-decoration: none;
text-align:center;
vertical-align:middle;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='templates/seaplanet2/images/button.png');
background-image:none;
height:56px;
width:166px;
display:block;
background-repeat:no-repeat;
text-shadow:black 3px 2px;
}
a.mainlevel:visited {
font-family:Arial, Helvetica, sans-serif;
font-size:1em;
font-weight:bold;
padding-top:18px;
color:#FF00CC;
text-decoration: none;
text-align:center;
vertical-align:middle;
background-image:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='templates/seaplanet2/images/button.png');
height:56px;
width:166px;
background-repeat:no-repeat;
display:block;
text-shadow:black 3px 2px;
}
a.mainlevel:hover {
font-family:Arial, Helvetica, sans-serif;
padding-top:18px;
font-size:1em;
font-weight:bold;
color:#FF00CC;
text-decoration: none;
text-align:center;
vertical-align:middle;
background-image:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/button_over.png');
background-repeat:no-repeat;
height:56px;
width:166px;
display:block;
text-shadow:black 3px 2px;
}
.contentheading {
font-family:Arial, Helvetica, sans-serif;
font-size:2em;
font-weight: bold;
color: #000066;
}
Gunnar Bittersmann
MudGuard