Hallo,
mein Problem ist, das meine Seite mit dem erstelltem HTML-, bzw. CSS-Code in Firefox 3.0.4, in Opera 9.64 und im IE Vers.8 korrekt angezeigt wird, aber im IE 7 nicht (IE 6 und tiefer habe ich nicht testen können). Im IE 7 verutschen die Container um ca. 3px und das Logo (con_logo) wird garnicht angezeigt. Nun habe ich beim "Stöbern" im Netz einiges über einen sogenannten 3 Pixel Bug gelesen und auch verschiedene Lösungsansätze getestet, leider ohne Erfolg.
Vielen Dank im Voraus für Eure Hilfe!
body
{
background-color: #CBBAA0;
}
#con0
{
position: absolute;
top: 50%;
left: 50%;
width: 825px;
height: 500px;
margin-left: -413px;
margin-top: -250px;
background-color: #FCFC00;
z-index: 1;
}
#con_right
{
position: relative;
height: 500px;
width: 500px;
background-color: red;
float: right;
z-index: 2;
}
#con_right_top
{
position: relative;
height: 250px;
width: 250px;
background-color: #ABCDEF;
float: right;
z-index: 3
}
#con_right_left
{
position: relative;
height: 250px;
width: 250px;
background-color: #006666;
float: left;
z-index: 4
}
#con_right_bottom
{
position: relative;
height: 250px;
width: 500px;
background-color: #CCCCCC;
float: right;
z-index: 5;
}
#con_left
{
position: relative;
height: 500px;
width: 325px;
background-color: #ffffff;
float: left;
z-index: 6;
}
#con_logo
{
position: absolute;
width: 179px;
height: 180px;
margin-left: 220px;
margin-top: 190px;
background-color: #AACFB0;
z-index: 7;
}
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>project-campus</title>
<meta name="keywords" content="project-campus" />
<meta name="description" content="project-campus" />
<link rel="stylesheet" type="text/css" href="kontakt.css" media="screen">
</style>
</HEAD>
<BODY>
<div id="con0">
<div id="con_right">
<div id="con_right_top">
<img src="images/kontakt-250x250.jpg" border="0" />
</div>
<div id="con_right_left">
</div>
<div id="con_right_bottom">
</div>
</div>
<div id="con_left">
</div>
<div id="con_logo">
<img src="images/logo.gif" border="0" />
</div>
</div>
</body>
</HEAD>
</HTML>