|
|||
Angabe "height: inherit" wird vom IE falsch dargestellt
Hallo Forum,
ich probiere gerade das Layout meiner Seite tabellenfrei zu bekommen. Das ist der Code: Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>Without tables</title> <style type="text/css"> body {margin: 0px;} #cover {width: 720px; height: 500px; margin: 20px auto; background-color: #000000;} #border_top {position: absolute; width: 700px; height: 10px; margin-left: 10px; background-color: #0000ff;} #border_left {position: absolute; width: 10px; height: inherit; margin-left: 0px; background-color: #00ff00;} #border_right {position: absolute; width: 10px; height: inherit; margin-left: 710px; background-color: #00ff00;} #search_main {position: absolute; width: 360px; height: 25px; margin-top: 10px; margin-right: 350px; margin-left: 10px; background-color: #ff0000;} #nav_top {position: absolute; width: 360px; height: 25px; margin-top: 10px; margin-right: 10px; margin-left: 350px; background-color: #ff9900;} </style> </head> <body> <div id="cover"> <div id="border_top"></div> <div id="border_left"></div> <div id="border_right"></div> <div id="search_main"></div> <div id="nav_top"></div> </div> </body> </html> Weil ich schon mal solche Probleme mit dem IE hatte, habe ich meine Seite von Anfang an mit einer Tabelle entwickelt. Nur ist das natürlich nicht sonderlich akutuell. Weiß jemand, wie man das Problem mit dem IE beheben kann? |
Sponsored Links |
|
|||
Du hast doch lauter feste Höhen. Dann kannst du sie doch auch mit einem konkreten Wert angeben.
Insgesamt sieht dein Konstrukt absolut suboptimal aus. Wenn du den Umstieg von Tabellen zu CSS-Layouts wagen willst, musst du ganz woanders ansetzen: beim Verständnis von Markup. Vorsprung durch Webstandards | Semantischer Code - Definitionen, Methoden, Zweifel Leere Divs wie Tabellenzellen aneinanderkleben bringt dich nicht weiter (Google: "Div-Suppe", Divitis). Vergiss zuerst deinen Layoutwunsch. Schreib deine Inhalte hin. Zeichne sie mit den passenden HTML-Elementen aus (Stichwort: Semantik). Erst wenn du das hast: Fang an, dir Gedanken zu machen, wie du mit den vorhandenen Elementen dein Layout umsetzen kannst. Absolute Positionierung wirst du nicht brauchen. Wenn du etwas nebeneinander willst: Beschäftige dich mit Float und Clear. Dabei helfen die FAQ weiter.
__________________
Corina Rudel Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken |
|
|||
Layout ist egal?
Fricca, Du schlägst als Lösung also vor, auf so etwas wie grafischer Ränder vollkommen zu verzichten. Mit der Idee von möglichst simplen Websites mit validen Coeds kann ich mich sehr gut anfreunden.
Nur hat mir Dein Link beim konkreten Problem nicht geholfen. Mein Layout funtioniert ja auch - eben nur nicht im IE. Kannst du nochmal sagen, warum das so suboptimal ist? |
|
|||
Zitat:
Ich sage dir, dass du einen anderen Weg gehen musst. Du musst umdenken. Dazu musst du zuerst dein Layout vergessen und deine Inhalte mit HTML auszeichnen. Und erst wenn du das hast, dann darfst du dir Gedanken machen, wie du mit dem dann vorhandenen Elementen dein Wunschlayout umsetzt. Du sollst nicht deinen Entwurf ändern sondern die Herangehensweise an die Umsetzung. Lesestoff: A List Apart: Articles: 12 Lessons for Those Afraid of CSS and Standards "Lesson No. 1: Everything you know is wrong… sort of" Das geht jedem Tabellendesigner so. Es hilft nur: Ganz viel lesen. Am besten ein Buch. Little Boxes sollte erhellend sein. Zitat:
Du hast kein "konkretes Problem", sondern der Ansatz ist grundfalsch. Wenn du unbedingt bunte leere Boxen mit einer Höhe von 500px aneinanderkleben willst, dann schreib auch 500px als Höhe hin. Das versteht auch der IE. Mit "Layout per CSS" hat das wenig zu tun. Zitat:
__________________
Corina Rudel Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken Geändert von fricca (08.09.2008 um 21:45 Uhr) |
|
|||
Wie fricca schon sagte, die Little Boxes Bücher von Peter Müller helfen dir bei den Anfängen sehr viel weiter. Nach dem lesen wirst du anders denken und deine Aufgaben auch auf eine andere Art und Weise erledigen - besser!
Wenn du kein Geld ausgeben möchtest schau in die CSS-FAQ hier im Forum und fütter Google mit ein paar Fragen, dann kommst du auch ans Ziel |
Stichwörter |
bug, inherit, internet explorer |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Spry Menü bar falsch dargestellt im IE | Hilltono | CSS | 2 | 02.12.2010 22:01 |
Umlaute werden falsch dargestellt | Xethon | (X)HTML | 5 | 21.02.2010 14:51 |
Formular wird falsch dargestellt | mitch26 | (X)HTML | 1 | 06.03.2009 10:59 |
Navigation wird falsch dargestellt! | st0ffy | CSS | 16 | 01.02.2008 11:30 |