nicht angemeldet
Also mein Layout soll ungefähr wie Deines aussehen. Habs tabellenfrei geschrieben. Funzt auf allen Browsern ausser auf diesem verdammten Internetexplorer. Habe Spacer mit 2 Pixeln Höhe definiert, die werden aber mit ca. 20 Px angezeigt. Die breite liegt bei 760Px bei mir. Drei Boxen, die in der Summe 760 ergeben werden falsch dargestellt (entspräche Deiner Box 4, die bei mir rechts unter Box 7 geklebt wird,da sich IE wohl verrechnet. Ich bin am Ende meiner Geduld und werde jetzt wohl ne Browserweiche einbauen müssen. MICROSOFT ABSCHALTEN! (würde mich freuen, wenn mir jemand meinen Fehler zeigt, dann nehme ich auch meine MS Angriff zurück!)
Hier mein Layout:
+-----------------+ | 1 | +-----------------+ +---+---------+---+ | | | | | 2 | 3 | 4 | | | | | +---+---------+---+ | 5 | 6 | 7 | +---+---------+---+
mein Template: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/Strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <link rel="stylesheet" type="text/css" href="css.css"> </head> <body> <!-- ###DOCUMENT_BODY### --> <!-- Gesamter Inhalt--> <div id="main"> <!-- Titelzeile --> <div id="kopf"></div> <!-- Spacer 2px --> <div id="black"></div> <!-- Navigation --> <div id="platz_links"></div> <div id="navi_links">###MENU###</div> <div id="navi_rechts">###DATE###</div> <div id="platz_rechts"></div> <!-- Spacer 2px --> <div id="black"></div> <!--Inhalt--> <div id="content_links">###CONTENT_LEFT###</div> <div id="content">###CONTENT###</div> <div id="content_rechts"></div> <!-- Spacer 2px --> <div id="black"></div> <!-- Fussleiste --> <div id="platz_links"></div> <div id="fuss_links">###IMPRESSUM###</div> <div id="fuss_rechts">© ###COPYRIGHT###</div> <div id="platz_rechts"></div> <!-- Spacer 2px --> <div id="black"></div>
</div> <!-- ###DOCUMENT_BODY### --> </body> </html>
Hier die css.css
body { margin-top:0; margin-bottom:0; margin-right:20; background-color:#bbbbbb; text-align:center; }
h1 {text-align: center;font-size:13px;font-weight:bold;color:#e40c0c;margin:0px;} h2 {font-size:14px;color:#000000;} h3 {font-size:14px;color:#000000;} p {margin-top:0px;}
#main{ /float:left; vertical-align: top;/ margin: 0px auto; width: 760px; }
a:link, a:visited, a:active { float:left; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; text-decoration: none; text-align: left; display:block; . color:#1448f3; margin-right: 5px; }
a:hover { float:left; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; background-repeat:no-repeat; background-position:top; text-align: left; margin-right:5px; } #kopf{ float:left; vertical-align: top; padding: 0 0 0 0; margin: 0 0 0 0; width: 760px; height: 100px; background-image: url(banner/banner_2.jpg); }
/2px space schwarz/ #black{ float:left; vertical-align: top; padding: 0 0 0 0; margin: 0 0 0 0; height: 2px; width: 760px; background-color: #000000; }
#platz_links{ float:left; vertical-align: top; width:20px; height:20px; padding: 0 0 0 0; margin: 0 0 0 0; background-color:#CC0000; }
#platz_rechts{ float:left; vertical-align: top; padding: 0 0 0 0; margin: 0 0 0 0; width:20px; height:20px; background-color:#CC0000; }
/linke navigationsleiste/ #navi_links{ float:left; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; width: 560px; height: 20px; background-color: #CC0000; text-align:left; }
/rechte navigationsleiste/ #navi_rechts{ float:left; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; width: 160px; height: 20px; background-color: #CC0000; text-align:right; }
#content{ float:left; vertical-align: top; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; width: 440px; height: 430px; background-color: #ff9933; text-align:justify; }
#content_links{ float:left; vertical-align: top; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; width: 160px; height: 430px; background-color: #ff9933; }
#content_rechts{ float:right; vertical-align: top; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; width: 160px; height: 430px; background-color: #ff9933; }
#platz_vertikal{ float:left; vertical-align: top; padding: 0 0 0 0; margin: 0 0 0 0; margin: 0 0 0 0; width: 760px; height: 10px; background-color: #ff9933; }
/Fu?zeile/ #fuss_links{ float:left; vertical-align: top; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; width: 360px; height: 20px; text-align:left; background-color:#CC0000; }
#fuss_rechts{ float:left; vertical-align: top; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; width: 360px; height: 20px; text-align:right; background-color:#CC0000; }