boxen modell. ie 5 macht ärger ;-(
peter
- css
0 peter0 Thomas J.S.
hallo zusammen,
ich habe folgendes problem mit dem ie 5x (ie 6 hab ich nicht von daher kann ich nicht sagen ob er auchd as problem hat):
ich versuche die 3 boxen pixelgenau aneinander zu legen. leider bekomme ich den pixel abstand nixht weg ;-(
kann jemand helfen?
hier der html code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Unbenannt</title>
<meta http-equiv="imagetoolbar" content="no">
<style type="text/css" media="screen">
body
{
border: 0px;
border-bottom : 0 0 0;
border-left : 0;
border-right : 0;
border-top : 0;
border-width : 0;
margin : 0 0 0 0;
padding : 0 0 0 0;
font: 0.59em vardana, arial, hevetica, sans-serif;
text-align: center;
color: #red;
background-color: #D6D6D6;
}
#container
{
float: left;
text-align: left;
width: 992px;
height: auto;
border: 0px;
border-bottom : 0 0 0;
border-left : 0;
border-right : 0;
border-top : 0;
border-width : 0;
margin : 0 0 0 0;
padding : 0 0 0 0;
background-color: red;
}
#left_container
{
float: left;
width: 36px;
height: 780px;
border: 0px;
border-bottom : 0 0 0;
border-left : 0;
border-right : 0;
border-top : 0;
border-width : 0;
margin : 0 0 0 0;
padding : 0 0 0 0;
background-color: yellow;
}
#head_container
{
width: 914px;
height: 151px;
border: 0px;
border-bottom : 0 0 0;
border-left : 0;
border-right : 0;
border-top : 0;
border-width : 0;
margin : 0 0 0 0;
padding : 0 0 0 0;
background-color: fuchsia;
}
#right_container
{
float: right;
width: 36px;
height: 780px;
border: 0px;
border-bottom : 0 0 0;
border-left : 0;
border-right : 0;
border-top : 0;
border-width : 0;
margin : 0 0 0 0;
padding : 0 0 0 0;
background-color: yellow;
}
</style>
</head>
<body>
<div id="container">
<div id="left_container">LEFTC</div>
<div id="right_container">RIGHTC</div>
<div id="head_container">HEADC</div>
</div>
</body>
</html>
Hallo,
ich habe folgendes problem mit dem ie 5x (ie 6 hab ich nicht von daher kann ich nicht sagen ob er auchd as problem hat):
Hat er, und bei deinem Code eigentlich alle Browser: im Firefox und Opera gibt es zwischen HEADC und RIGHTC einen Amstand von ca. 1cm.
ich versuche die 3 boxen pixelgenau aneinander zu legen. leider bekomme ich den pixel abstand nixht weg ;-(
kann jemand helfen?
#left_container width:36px; + #right_container width:36px; + #head_container width:914px; = 986px
#container width:992px; != 986px
Du kannst dir http://de.selfhtml.org/css/layouts/mehrspaltige.htm#dreispaltig durchlesen.
Und so funktioniert dein Code:
Grüße
Thomas
--------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Unbenannt</title>
<meta http-equiv="imagetoolbar" content="no">
<style type="text/css" media="screen">
body
{
border:0px;
margin:0px;
padding:0px;
font:0.59em vardana, arial, hevetica, sans-serif;
text-align:center;
color:red;
background-color:#D6D6D6;
}
#container
{
float:left;
text-align:left;
width:992px;
height:auto;
border:0px;
margin:0px;
padding:0px;
background-color:red;
}
#left_container
{
float:left;
width:36px;
height:780px;
border:0px;
margin:0px;
padding:0px;
background-color:yellow;
}
#head_container
{
float:left;
width:920px;
height:151px;
border:0px;
margin:0px;
padding:0px;
background-color:fuchsia;
}
#right_container
{
float:right;
width:36px;
height:780px;
border:0px;
margin:0px;
padding:0px;
background-color:yellow;
}
</style>
</head>
<body>
<div id="container">
<div id="left_container">LEFTC</div>
<!-- Reihenfolge geändert! -->
<div id="head_container">HEADC</div>
<div id="right_container">RIGHTC</div>
</div>
</body>
</html>