|
|||
Rahmen Problem
Ich habe ein problem mit dem Border (rahmen)
ich versuche gerade ein neues design zu machen mit CSS, und stoße schon am anfang an ein problem. ich habe 3 DIV container. einer für den head "titel" dann einer für das Menü, was links "floatet" und für den content, was rechts "floatet". ein 4. DIV Container schließt alles ein, und hat einen rahmen bekommen der sich um den kompletten inhalt schließen soll. und da ist das Problem. Im IE6 und Opera7 ist alles okay, im FF jedoch schauts nicht so aus, da wird der border nur um den "titel" gezogen ... und ich dachte immer, IE zeigt alles falsch an ... Seite für die faulen, bilder: IE FF und hier der HTML und CSS Code: HTML Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>krak0s.de - New CSS Design</title> <link rel="stylesheet" type="text/css" href="haupt.css"> </head> <body> <div id="rahmen"> <div id="title"> [img]gfx/krak0slogodblue.gif[/img] <h1>New Webdesign</h1> </div> <div id="navigation"> Home About Me Projects Downloads Links Site History Impressum </div> <div id="content"> Content :D blindertextblindertext ^^ test </div></div> </body> </html> Code:
/* Grundstruktur */ body { background-color:#333366; color:white; margin:20px; } #rahmen { width:600px; border:solid 1px; } h1 {font-size:40px;color:#ffffff;margin-bottom:0px;} /* Links */ a:link, a:visited { color:white; } a:hover, a:active { color:lime; background-color:yellow; } /* Titel */ #title { border-bottom:dotted 1px; margin-bottom:20px; height:60px; } img.logo { float:right; width:200px; height:60px; } /* Navigation */ #navigation { padding-top:10px; border-right:solid 1px; float:left; display:block; width:100px; clear:left; height:50%; line-height:30px; } a.nav:link, a.nav:visited { color:#ffffff; text-decoration:none; } a.nav:hover, a.nav:active { color:#ff0000; text-decoration:none; } /* Hauptteil */ #content { float:right; width:449px; margin:0px 20px; } und vlt auch genau erklären warum was falsch war. wenn was unklar ist, sagt es |
Sponsored Links |
|
||||
Fließende Boxen (»float«) beeinflussen nicht die Höhe ihres Elternelementes. Ersetze das letzte </div> durch <br class="clear"></div>, und schreib ins Stylesheet:
Code:
.clear { clear: both; }
__________________
toscho.de |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Rahmen um Rahmen bei Bildern | uooao388d99 | CSS | 3 | 13.12.2008 14:10 |
Problem mit Rahmen um alle Bilder | schnickidemi | CSS | 2 | 30.10.2008 14:24 |
IE Problem mit Rahmen | SarDuri | CSS | 13 | 08.10.2008 11:13 |
Problem mit 3 Spaltigem Layout | stipo | CSS | 0 | 27.05.2006 21:58 |
Rahmen (Grafik) - Problem | Heart | CSS | 2 | 24.05.2005 21:17 |