dwex
Erfahrenes Mitglied
Hallo Leute,
ich habe nachfolgenden Quelltext gebastelt und hänge momentan an einem Problem. Das Problem betrifft nur den IE(7) nicht jedoch den FF, Opra oder Safari.
Es geht mir darum, dass der Hintergrund des Containers wenn das DIV "links" höher ist als das DIV "rechts" im IE (siehe Screenshot1) nicht angezeigt werden soll - beim FF, Opra oder Safari habe ich das Problem nicht (siehe Screenshot2).
Kann mir jemand weiterhelfen?
Habst mit clearfix schon probiert geht jedoch nicht - vielleicht hab ich es aber auch falsch gemacht.
Vielen Dank für eure Hilfe im voraus!
ich habe nachfolgenden Quelltext gebastelt und hänge momentan an einem Problem. Das Problem betrifft nur den IE(7) nicht jedoch den FF, Opra oder Safari.
Es geht mir darum, dass der Hintergrund des Containers wenn das DIV "links" höher ist als das DIV "rechts" im IE (siehe Screenshot1) nicht angezeigt werden soll - beim FF, Opra oder Safari habe ich das Problem nicht (siehe Screenshot2).
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Test</title>
<style type="text/css">
body {
color:black;
background-color:white;
padding: 0px;
margin: 0px;
font-family:verdana,arial,sans-serif;
font-size: 12px;
}
#container {
background-color:rgb(160,61,72);
width:920px;
margin-left:auto;
margin-right:auto;
margin-top: 20px;
}
#links {
float:left;
width:200px;
padding:10px;
background-color: rgb(160,61,72);
}
#rechts {
margin-left:220px;
background-color:white;
padding:0px 0px 10px 20px;
}
p { margin:0; }
#header {
background-color: rgb(160,61,72);
text-align:center;
}
.clearfix:after {
content:".";
display:block;
height:0;
font-size:0;
clear:both;
visibility:hidden;
}
.clearfix {display:inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height:1%;}
.clearfix {display:block;}
/* End hide from IE-mac */
/* body und schrift definitionen */
.menu{
/* border: 1px;
border-style: solid;
border-bottom: 0px;
border-color: #CCC;*/;
padding:10px;
background-color:rgb(160,61,72);
font-family:verdana,arial,sans-serif;
font-size: 12px;
}
.menu li{
list-style-type: none;
margin: 0px;
padding: 0px;
/* border-bottom: 1px solid;
border-color: #ccc;*/
}
.menu ul{
list-style-type: none;
margin: 0px;
padding: 0px;
/* border-bottom: 1px solid;
border-color: #ccc;*/
}
.menu ul ul {
padding-left: 10px;
/* background-color: #E1EAEA;*/
border-bottom: 0px;
}
.menu a:link, .menu a:visited, .menu a:active {
padding: 4px 10px 4px 10px;
color: white;
font-weight:bold ! important;
display: block;
text-decoration: none;
font-weight: normal;
}
.menu a:hover {
text-decoration: none;
color: rgb(160,61,72) ! important;
background-color:#F2F7F7;
}
.menu a.menu_current {
font-weight: bold;
color: rgb(255,242,58);
/* background-color: #AEBABD;*/
}
</style>
</head>
<body>
<div id="header">das ist der Header</div>
<div id="container">
<div id="links">
<div class="menu">
<ul>
<li><span class="menu_current"><a href="index.php" target="_top" class="menu_current"> Home </a></span>
</li>
<li><span class="menu_default"><a href="beruflicher-werdegang.php" target="_top" class="menu_default"> Beruflicher Werdegang </a></span>
</li>
<li><span class="menu_default"><a href="unser-team.php" target="_top" class="menu_default"> Unser Team </a></span>
</li>
<li><span class="menu_default"><a href="behandlungsspektrum.php" target="_top" class="menu_default"> Behandlungsspektrum </a></span>
</li>
<li><span class="menu_default"><a href="igel.php" target="_top" class="menu_default"> IGEL </a></span>
</li>
<li><span class="menu_default"><a href="spezialisierte-labordiagnostik.php" target="_top" class="menu_default"> Spezialisierte Labordiagnostik </a></span>
</li>
</ul>
</div>
</div>
<div id="rechts">
<p>Sed tincidunt tortor vitae arcu. Donec aliquam. Pellentesque tempor imperdiet risus. Sed nonummy ullamcorper enim. Maecenas tempus tincidunt orci. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Morbi euismod convallis lacus. Quisque feugiat ullamcorper neque. Sed nunc.</p>
<p>Nunc quam eros, gravida at, vestibulum at, eleifend ac, augue. Cras imperdiet eleifend felis. Curabitur faucibus. Praesent dictum. Nam metus lorem, dapibus nonummy, vehicula eu, laoreet vitae, diam. Quisque malesuada dapibus mauris. Duis nulla nulla, gravida quis, suscipit non, sodales in, lacus. Praesent vel elit euismod magna vehicula scelerisque. Praesent luctus nisi sed quam. Donec condimentum. Curabitur nulla ante, posuere aliquam, venenatis nec, porta a, est.</p>
</div>
</div>
</body>Kann mir jemand weiterhelfen?
Habst mit clearfix schon probiert geht jedoch nicht - vielleicht hab ich es aber auch falsch gemacht.
Vielen Dank für eure Hilfe im voraus!
Anhänge
Zuletzt bearbeitet:
brauche wohl Urlaub 
