3spaltiges layout
Hagen
- css
Hallo,
habe folgendes css für ein 3 spaltiges layout:
#body{
margin:0;
padding:0;
}
#left{
margin-left:8%;
width:28%;
height:200px;
float:left;
background-color:#0E2972;
}
#center{
width:28%;
height:200px;
float:left;
background-color:#FEE765;
}
#right{
margin-right:8%;
width:28%;
height:200px;
float:right;
background-color:#99CC66;
}
die 3 boxen sollen mittig genau aneinander "kleben", später kommt noch ein 1% rand zwischen den boxen hinzu.Nur leider klappt das mit dem kleben nicht so ganz:-). Dachte mir ich habe 100% 3*28 für die boxen bleiben noch jeweils 8% für das margin links und rechts, anscheinend rechnet der ie anders, weiß jemand wie? In FF und OP gehts.
MFG Hagen
Hallo,
dein Problem ist das du falsch floatest.
Gib dem #right mal ein float:left anstatt float:right.
Dann müsste es funktionieren.
Schönen Gruss
Hey danke für deine Antwort
dein Problem ist das du falsch floatest.
Gib dem #right mal ein float:left anstatt float:right.
Dann müsste es funktionieren.
nö jetzt ist die anordnung in keinem browser mehr richtig.
MFG Hagen
Hey danke für deine Antwort
dein Problem ist das du falsch floatest.
Gib dem #right mal ein float:left anstatt float:right.
Dann müsste es funktionieren.nö jetzt ist die anordnung in keinem browser mehr richtig.
MFG Hagen
Seltsam, ich habe es in ie7, ff2.02 und opera9 getestet. Klappt bei mir wunderbar.
Hier mal der komplette Quelltext mit dem ich getestet habe:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<style type="text/css">
<!--
#body{
margin:0;
padding:0;
}
#left{
margin-left:8%;
width:28%;
height:200px;
float:left;
background-color:#0E2972;
}
#center{
width:28%;
height:200px;
float:left;
background-color:#FEE765;
}
#right{
margin-right:8%;
width:28%;
height:200px;
float:left;
background-color:#99CC66;
}
-->
</style>
</head>
<body>
<div id="left"></div>
<div id="center"></div>
<div id="right"></div>
</body>
</html>
Gruss
schaus dir mal im ie6 an:-).
MFG
schaus dir mal im ie6 an:-).
MFG
Tut mir leid, habe nur den 7er. Eine Parallelinstalation ist mir zu riskant :-(
Gruss
ok trotzdem vielen dank, und du hättest keine idee woran es liegen könnte?
MFG Hagen
ok trotzdem vielen dank, und du hättest keine idee woran es liegen könnte?
MFG Hagen
Der IE6 hat so viele Bugs, deren Hacks ich auch nicht alle kenne.
Hier muss eine neue Lösung her.
Stichwort wäre hier Listenelemente, also:
<ul>
<li></li>
<ul>
Das kommt dem was du vor hast von der Optik her gleich, und der 6er müsste das eigentlich schlucken. Einfach mal probieren.
Gruss
Hi Hagen!
Vielleicht hilft dir http://www.positioniseverything.net/explorer/doubled-margin.html.
MfG H☼psel