|
|||
gefloatete div's brechen ungewollt um...
hallo ihr, vielleicht kann mir jemans bei diesen problemen helfen: diese website: ATHOS Griechische Gastlichkeit in Altenburg wird meiner meinung nach richtig in allen wichtigen aktuellen browsern dargestellt (safari, firefox und ie7) aber der ie6!!!
das schlimmste problem: unter "speisekarten" bricht der dritte und letzte left gefloatete div nach unten weg das menu wird falsch angezeigt: der hintergrund für den letzten button "impressum" fehlt: impressum.jpg (bitte nicht lachen, hab ich von meinen windos-rechner abfotografiert weil dort habe ich so einen ie6 simulator) und das letzte: ich hatte ursprünglich in den oberstem design-bild rechts ein kleines area shape mit einem verweis angelegt, bis ich gemerkt habe das dadurch im ie6 das div nach unten aufgeblasen wird +++ ich würde mich schon über die lösung eines dieser drei probleme riesig freuen!!! +++ danke schon mal für eure hilfe anbei noch das css: @charset "UTF-8"; /* CSS Document */ * {margin: 0; padding: 0;} body { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 75%; text-align: center; background-color: #666699; color: #666; } #wrap { text-align: left; width: 867px; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto; background-image: url(../images/Layout/bg_wrap.gif); background-repeat: repeat-y; background-position: 151px 50%; } #header_1 { height: 150px; width: 867px; margin: 0px; padding: 0px; line-height: 0px; } #header_2 { height: 65px; width: 867px; background-image: url(../images/Layout/athos_header_2.gif); background-repeat: no-repeat; margin: 0px; padding: 0px; vertical-align: top; } #sidebar { float: left; width: 151px; padding: 0px; background-image: url(../images/Layout/figur.gif); background-repeat: no-repeat; background-position: top; position: relative; margin: 0px; height: 311px; } #sidebar_2 { float: left; height: auto; width: 250px; position: relative; background-color: #FFF; margin: 0px; padding: 0px; } #content { float: left; width: 716px; text-align: left; background-image: url(../images/Layout/bg_content.gif); background-repeat: repeat; background-position: left top; margin: 0px; padding: 0px; height: auto; position: relative; } #content_sec_menue { float: left; width: 466px; text-align: left; margin: 0px; padding: 0px; height: 100%; position: relative; } #footer { clear: both; height: 88px; width: 851px; background-image: url(../images/Layout/footer.gif); background-repeat: no-repeat; } #navi { padding: 0; width: 141px; margin-top: 75px; margin-right: 0; margin-bottom: 0; margin-left: 0; } #navi ul, #navi li{ list-style-type: none; font-weight: bold; } #navi li a { text-decoration: none; width:100%; text-align: right; height: 14px; padding: 5px; display: block; } #navi a:link, #navi a:visited { color: #676698; } #navi #akt { color: #333366; background-color: #FFF; } #navi a:hover { color: #FFFFFF; background-color: #676698; } h1, h2, h3, h4, h5, h6 { color: #333366; font-weight: normal; margin-top: 20px; margin-right: 100px; margin-bottom: 20px; margin-left: 50px; } p { color: #666; margin-left: 50px; margin-right: 100px; margin-top: 20px; margin-bottom: 20px; } .text_small { font-size: 9px; margin-top: 10px; margin-right: 100px; margin-bottom: 5px; margin-left: 50px; padding: 0px; color: #999; } .text_blau { color: #333366; margin-top: 5px; font-weight: bold; } .text_space_left { margin-left: 270px; } .text_menue { color: #090; text-indent: 50px; display: inline; margin-left: 50px; } .bild { float: left; margin-top: 20px; margin-left: 50px; } .bild_390 { margin-top: 50px; } #navi_menue { width: 250px; background-color: #FFF; } #navi_menue ul, #navi_menue li { list-style-type: none; font-weight: bold; margin-left: 50px; font-size: 90%; padding-top: 3px; padding-right: 0px; padding-bottom: 3px; padding-left: 0px; } #navi_menue li a { text-decoration: none; width:250px; text-align: left; display: inline; padding-top: 2px; padding-right: 5px; padding-bottom: 2px; padding-left: 5px; height: 14px; } #navi_menue a:link, #navi_menue a:visited { color: #676698; } #navi_menue #akt { color: #FFF; background-color: #666699; } #navi_menue a:hover { color: #FFFFFF; background-color: #9999cc; } #start { text-align: center; height: 100%; width: 100%; margin-top: 100px; } |
Sponsored Links |
Sponsored Links |
|
|||
hallo und danke für dein gutes auge. ich habe gesucht und gesucht aber das der fehler dort liegen könnte, darauf wäre ich nie gekommen nun habe ich ein extra css für h2 gemacht, weil für h1 brauche ich aus designtechnischen gründen die 100 margin. juhu!!!
hätte vielleicht noch einer eine idee wegen des areashapes-problem und des hintergrundes bei der linken navigation? dieser ie6 wird wohl aktuell noch von 25 bis 27 % usern weltweit genutzt. findet ihr das realistisch??? danke für die hilfe und grüße michael |
|
||||
Zitat:
Aso, btw: Browser-Greis: Microsoft will IE 6 bis 2014 unterstützen - PC-WELT
__________________
Rettet die Erde.... sie ist der einzige Planet mit Schokolade! |
|
||||
Zitat:
Auch bei Deinem Menü hast Du das Problem mit der Ausdehnung durch den IE < 7. Die Höhe der Links wird nicht beachtet, ist aber eh keine gute Idee, da Text enthalten ist und bei Textzoom überläuft. Deine Menü-BG-Grafik kann auch viel höher werden, denn es wird ja immer nur soviel angezeigt, wie das Menü hoch ist. Außerdem im IE 6: Whitespace-Bug im Menü, siehe FAQ. Und die Unterlänge der Header-Grafik dehnt diesen aus, gib ihr also display: block;. Und statt area shape würde ich einen normalen Link nehmen. Übrigens ist Fließtext in Großschrift nicht wirklich schön.
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten. Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.) |
|
|||
da ich ja ein anfänger in css und xhtml bin, verstehe ich folgendes nicht:
"Deine Menü-BG-Grafik kann auch viel höher werden, denn es wird ja immer nur soviel angezeigt, wie das Menü hoch ist." ich habe da ja ein bg.gif figur.jpg mit festergröße, welches ich in den div sidebar als bg einlade ohne wiederholung und oben angedockt. zu dem whitespace-bug: als neuling habe ich das menü von einer vorlage nachgebaut, die diese bestandteile hat: #navi +++ ??? +++ #navi ul, #navi li +++ ??? +++ #navi li a +++ ??? +++ #navi a:link, #navi a:visited +++ normalzustand +++ #navi #akt +++ da bin ich gerade +++ #navi a:hover +++ wenn ich drüber rolle +++ die letzten drei glaube ich zu verstehen, bei den ersten dreien bin ich mir nicht sicher welche id welche funktion hat. das müßte ich ja wissen um bei der richtigen id block bzw. inline zu setzen "Und die Unterlänge der Header-Grafik dehnt diesen aus, gib ihr also display: block;" sollte ich jetzt dieses block in den header setzen oder wo? danke danke und nochmals danke!!! grüße michael |
|
||||
Zitat:
Ich sehe eh gerade, dass dieser Bug bei Dir doch nicht auftritt - die größeren Abstände kommen dadurch zustande, dass der IE 7 Deine height-Deklaration von a ignoriert. Die sollte unbedingt raus! Siehe dennoch FAQ. #header_1 img bekommt display.
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten. Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.) |
|
|||
Also ich beteilige mich auch am IE Death March, da ich denke, dass es langsam mal genug ist mit dem Ding. Man sollte mal eine Werbekampagne starten im TV um ihm den Rest zu geben.
Denke mit Windows 7 werden die IE6 Anteile stark zurückgehen. Frisst einfach zuviel Zeit die optimierung dafür. |
Sponsored Links |
|
||||
Solche frommen Wünsche höre ich seit Jahren Mitte 2006 hieß es "Wenn der IE 7 kommt, ist der IE 6 dank Auto-Update bald verschwunden". Passiert ist fast nichts. Später hieß es "Wenn Vista kommt, ist der IE 6 bald verschwunden". Passiert ist wieder fast nichts. Und auch jetzt werden weder IE 8, noch Windows 7, noch irgendwelche Initiativen viel daran ändern.
Es wird imho noch ca. 5 Jahre dauern, bis der IE von seinen derzeit 41% (Webhits) auf unter 10% fällt - und selbst das ist noch viel zuviel, um ans Ignorieren denken zu können.
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten. Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.) Geändert von heiko_rs (21.08.2009 um 16:04 Uhr) |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
n Div's in eine Zeile | Mustangore | CSS | 9 | 20.08.2009 16:19 |
gefloatete Divs - Umbruch verhindern... | Mthi77 | CSS | 4 | 20.03.2009 13:05 |
Gefloatete, Zentrierte Divs mit festen Zwischenabständen | mexyn | CSS | 12 | 05.11.2008 15:47 |
zwei gefloatete divs | amateur23 | CSS | 4 | 05.12.2006 12:01 |
DIVs brechen um und Abstand stimmt nicht... | Robin | (X)HTML | 4 | 07.06.2005 00:38 |