|
|||
Problem mit Layout auf IE6
ich habe ein "liquid" layout zu programmieren versucht und darstellungsprobleme mit IE6. Mit IE7 und FF ist es OK aber nicht mit eben IE6.
die Darstellung sollte sein wie in angehängtem Bild. untitled2.gif: ein header oben(weiss), eine navispalte links(rot) ein footer unten(grün), ein kriterienfeld(gelb) in der mitte und ein container(grün), der später mit den resultaten einer suchfunktion gefüllt wird (eine feststehende Kopfzeile und eine "scrollable" tabelle, ohne Scrollbalken). Mit IE6 sieht die Sache wie in untitled.gif aus und ich finde keine Lösung hier mein Codes: htm: Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <link href="test2.css" rel="stylesheet" type="text/css" > </head> <p>BLABLA</p> <div id="header"> <CENTER> <p>Header</p> </CENTER> </div> <div id="leftnavigation"> <p>LeftNav</p> </div> <div id="krit_fenster"> <p>KRIT</p> </div> <div id="content"> <p>Content</p> <div id="footer"> <h4> © by kraadde ( </h4> </div> </body> </html> Und hier die CSS datei: Code:
body { margin : 0; padding : 0; background-color : blue; color : black; font-family: arial, helveticacursive, genevacursive, sans-serif; height: 100%; display:inline; } /*****************************Header***************************/ #header { position : fixed; width : 100%; height : 20%; top : 0; right : 0; bottom : auto; left : 0; border-bottom : 4px solid #fff8dc; background-color : white; } /*****************************Linkes Fenster***************************/ #leftnavigation { position : fixed; top : 20%; left : 0; margin-right: 3%; margin-left: 3%; margin-top: 2%; height : 100%; color : white; padding: 0; overflow : hidden; width : 14%; text-align: center; background-color : red; } /*******************************Hauptfenster************************/ #container { position : fixed; width:100%; height:fixed; overflow-y:auto; float:right; } #content { position : fixed; top : 35%; margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 20%; width : 80%; height : 60%; padding-top : 0; color : #000000; border-left : 2px solid #cccccc; overflow : hidden; display:inline; background-color : green; } /*******************************Songauswahl************************/ #krit_fenster { position : fixed; top : 20%; bottom : 40%; margin : 0 0 0 20%; width : 80%; padding-left : 0; padding-right : 0; color : #000000; border-left : 2px solid #cccccc; overflow : hidden; height : 15%; border-top : 2px solid #cccccc; background-color : yellow; } /*******************************Auswahlresultate************************/ #tab_header{ position: fixed ; top : 0%; width : 100%; height : 10%; padding-left : 3%; font: 10pt Arial, geneva, helvetica; color : white; overflow : hidden; } #tab_result{ position: fixed ; top : 10%; width : 100%; height : 89%; padding-left : 3%; font: 10pt Arial, geneva, helvetica; color : white; overflow : auto; } #res_num{ height: 5%; width:0; border:0; font : 10pt Arial, Helvetica, geneva; color: white; } /*******************************Footer************************/ #footer { position : fixed; width : 100%; height : 5%; top : auto; right : 0; bottom : 0; margin-left : 0; margin-top: 0; padding-top: 0; border-top : 2px solid #cccccc; vertical-align:middle; text-align:center; background-color : green; } Vielen herzlichen Dank für gute und schnelle Tips Adriano |
Sponsored Links |
|
||||
Der IE6 & älter beherrscht "position:fixed" nicht und du hast ein <div> nicht geschlossen.
Positionier deine Elemente doch "float". Links dazu in den FAQ unter Punkt2.
__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen! Foren-FAQ |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Problem mit 3-spaltigem Layout im Firefox | Imhotep | CSS | 4 | 08.07.2008 18:17 |
Kniffliges Float Problem mit IE6 | simplex2k4 | CSS | 10 | 25.06.2008 16:27 |
Text-Zeichen im IE6 wiederholen sich – Problem... | rg69 | (X)HTML | 2 | 05.06.2008 15:36 |
Problem mit 3 Spaltigem Layout | stipo | CSS | 0 | 27.05.2006 21:58 |
Problem mit einem CSS Layout | nARC | CSS | 20 | 21.05.2005 07:28 |