zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden gefloatete div's brechen ungewollt um...

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 20.08.2009, 22:11
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 02.07.2009
Beiträge: 46
xhtmlmike70 befindet sich auf einem aufstrebenden Ast
Standard 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;
}
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 20.08.2009, 23:57
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.848
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

h2 in #sidebar_2 hat viel zu große seitliche margins, und der IE < 7 dehnt dann aus.
__________________
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.)
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 21.08.2009, 11:14
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 02.07.2009
Beiträge: 46
xhtmlmike70 befindet sich auf einem aufstrebenden Ast
Standard

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
Mit Zitat antworten
  #4 (permalink)  
Alt 21.08.2009, 11:25
Benutzerbild von Praktikant
Semantikbremse.
XHTMLforum-Kenner
 
Registriert seit: 22.04.2008
Beiträge: 4.985
Praktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz sein
Standard

Zitat:
Zitat von xhtmlmike70 Beitrag anzeigen
dieser ie6 wird wohl aktuell noch von 25 bis 27 % usern weltweit genutzt. findet ihr das realistisch???
Woher hastn das "wohl"? Ja, das ist realistisch, weil ne ganze Menge Leute Angst vor neuer Software haben, auch wenn sie vom gleichen Hersteller kommt. Ich persönlich verstehe das nicht....
Aso, btw: Browser-Greis: Microsoft will IE 6 bis 2014 unterstützen - PC-WELT
__________________
Rettet die Erde.... sie ist der einzige Planet mit Schokolade!
Mit Zitat antworten
  #5 (permalink)  
Alt 21.08.2009, 11:41
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 02.07.2009
Beiträge: 46
xhtmlmike70 befindet sich auf einem aufstrebenden Ast
Standard

ie 6 bis 2014!!!??? verdammt!!!
Mit Zitat antworten
  #6 (permalink)  
Alt 21.08.2009, 13:08
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.848
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von xhtmlmike70 Beitrag anzeigen
dieser ie6 wird wohl aktuell noch von 25 bis 27 % usern weltweit genutzt.
Mindestens, Webhits nennt knapp 41%: WebHits - Web-Barometer: Marktanteile und Marktentwicklung

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.)
Mit Zitat antworten
  #7 (permalink)  
Alt 21.08.2009, 14:36
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 02.07.2009
Beiträge: 46
xhtmlmike70 befindet sich auf einem aufstrebenden Ast
Standard

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
Mit Zitat antworten
  #8 (permalink)  
Alt 21.08.2009, 15:17
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.848
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von xhtmlmike70 Beitrag anzeigen
"Deine Menü-BG-Grafik kann auch viel höher werden, denn es wird ja immer nur soviel angezeigt, wie das Menü hoch ist."
Ich würde 2 Bilder verwenden: ein "normales", und ein "aufgehelltes", das der Navi zugewiesen wird. Letzteres beginnt natürlich erst weiter unten (so wie jetzt auch), kann aber sehr hoch sein (es ist ja trotzdem nur der Teil sichtbar, den die Navi benötigt).

Zitat:
Zitat von xhtmlmike70 Beitrag anzeigen
zu dem whitespace-bug
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.

Zitat:
Zitat von xhtmlmike70 Beitrag anzeigen
sollte ich jetzt dieses block in den header setzen oder wo?
#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.)
Mit Zitat antworten
  #9 (permalink)  
Alt 21.08.2009, 15:34
Benutzer
neuer user
 
Registriert seit: 25.02.2005
Ort: Bremen
Beiträge: 86
D3mOn befindet sich auf einem aufstrebenden Ast
Standard

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.
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 21.08.2009, 16:00
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.848
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von D3mOn Beitrag anzeigen
Denke mit Windows 7 werden die IE6 Anteile stark zurückgehen.
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)
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ä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


Alle Zeitangaben in WEZ +2. Es ist jetzt 17:50 Uhr.