IE7 vs FF anzeigeproblem

urlaut · #1 (**permalink**) 24.01.2010, 11:55

hallo,

hab ein ziemlich seltsames problem hier und könnte dringend hilfe grebrauchen:

http://urlaut.amsmpitz.at/austriancu...eat/index.html

Code:

<style type="text/css">
#container {
	position:absolute;
	width:950px;
	height:580px;
	left:50%;
	margin-left:-475px;
	margin-top:15px;
	border:solid 0px black;
}

#frame {
	position:absolute;
	top:0px;
	left:245px;
	background:#ffffff;
	border:solid 0px black;
	width:692px;
	padding-top:25px;
	padding-right:10px;
	height:515px;
	overflow-y:scroll;
	text-align:justify;
	font-family:arial;
	font-size:11px;
	border:0px;
}

#toplogo {
position:absolute;
top:0px;
left:0px;
width:243px;
height:68px;
}

#subnav {
	position:absolute;
	top:68px;
	left:0px;
	width:236px;
	height:467px;
}

#mainnav {
position:absolute;
top:545px;
left:0px;
width:950px;
height:35px;
}
</style>

im subnav-div ist die linke navbar zu finden. ein ganz simples ding, das in fireworks erstellt wurde.

in IE7 wird das ganze auch (bis auf einen winzigen spalt zwischen toplogo und subnav) korrekt angezeigt, soweit ich sehe, in FF und OPERA absolut nicht.

hat irgendjemand ne idee woher das kommt?

die mainnav funktioniert genau nach dem gleichen schema und macht in keinem browser schwierigkeiten.

laut meiner web developer toolbar (outline positioned elements: absolute) zieht's den subnav-div gewaltig in die länge, was absolut keinen sinn ergibt, nachdem das ursprungsbild aus dem die subnav erstellt wurde, exakt die größe des div hat...

besonders seltsam ist die geschichte, da ich, wenn ich quasi nur das ursprungsbildchen für die navleiste in den subnav-div setze (wie gesagt, die maße stimmen auf den pixel), alles normal angezeigt wird.

bitte dringend um hilfe.

merci,
urlaut.

Cocoon · #2 (**permalink**) 24.01.2010, 12:08

Zitat:

Zitat von urlaut

http://urlaut.amsmpitz.at/austriancu...eat/index.html

Der Server unter urlaut.amsmpitz.at konnte nicht gefunden werden.

urlaut · #3 (**permalink**) 24.01.2010, 12:23

sorry,

New Document

Cocoon · #4 (**permalink**) 24.01.2010, 13:26

Der Code ist riesengroßer Murks. Tabellenlayout gemischt mit diverse 'position: absolute;' kann nicht gut gehen. Dass Firefox und Opera - übrigens auch der IE 8 - da nur Käse anzeigen, wundert mich nicht.

Ich empfehle dir, dich ein wenig mit den Grundlagen von HTML und CSS zu beschäftigen.

Teil 1 kostenlos online lesen - Little Boxes - Webseiten gestalten mit HTML und CSS

urlaut · #5 (**permalink**) 24.01.2010, 13:32

ich wär trotzdem für eine antwort dankbar. immerhin funktioniert das ganze im mainnav-div ja einwandfrei, wo ebenfalls eine tabelle IM div ist.

wüßte auch nicht, wieso eine tabelle in einem div - egal was in der tabelle angezeigt wird - ein problem sein sollte. wir hatten bei zig webseiten so auch keine probleme bisher, bloß in diesem konkreten fall hapert es, daher poste ich auch hier, nachdem mir nicht klar ist was das problem verursacht.

also falls jemand tatsächlich eine idee hat, was das problem sein könnte, bitte um mitteilung.

urlaut · #6 (**permalink**) 24.01.2010, 13:34

dazu kommt noch daß das ganze in der web developer toolbar einwandfrei validated, keine CSS fehler und voll standards compliant.

Cocoon · #7 (**permalink**) 24.01.2010, 13:47

Zitat:

Zitat von urlaut

dazu kommt noch daß das ganze in der web developer toolbar einwandfrei validated, keine CSS fehler und voll standards compliant.

Das hat nichts zu bedeuten. Der W3C Validator sagt da nämlich ganz was anderes.

W3C Markup Validator - 7 Errors, 96 warnings

urlaut · #8 (**permalink**) 24.01.2010, 22:34

obwohl die tabelle im mainnav-div einwandfrei funktioniert bin ich nunmal deinem vorschlag gefolgt - und hab die navigation komplett ohne tabelle erstellt.

ein sehr interessanter anzeigenunterschied macht sich allerdings auch jetzt bemerkbar - der absolut keinen sinn ergibt... immerhin sind die einzelnen bilder der subnav jetzt bloß durch linebreaks getrennt.

wieso ist dann trotzdem ein abstand zwischen ihnen in FF / OPERA und keiner in IE7?

an ner table im div kann's diesmal wohl nicht mehr liegen.

Seite auf unserem Testserver

hier der CSS code:

Code:

<style>
#container {
	position:absolute;
	width:950px;
	height:580px;
	left:50%;
	margin-left:-475px;
	margin-top:15px;
	border:solid 0px black;
}

#frame {
	position:absolute;
	top:0px;
	left:245px;
	background:#ffffff;
	border:solid 0px black;
	width:692px;
	padding-top:25px;
	padding-right:10px;
	height:515px;
	overflow-y:scroll;
	text-align:justify;
	font-family:arial;
	font-size:11px;
	border:0px;
}

#toplogo {
position:absolute;
top:0px;
left:0px;
width:236px;
height:68px;
}

#subnav {
	position:absolute;
	top:68px;
	width:236px;
	height:210px;
}

#mainnav {
position:absolute;
top:545px;
left:0px;
width:950px;
height:35px;
}
</style>

und das ist jetzt der inhalt des subnav-div

Code:

<div id="subnav">
<a href="javascript:;" target="_self" onclick="MM_nbGroup('down','group1','bild','../../img/subnav/cultureat-bild02.gif',1)" onmouseover="MM_nbGroup('over','bild','../../img/subnav/cultureat-bild02.gif','',1)" onmouseout="MM_nbGroup('out')"><img src="../../img/subnav/cultureat-bild02.gif" alt="bildende kunst" name="bild" width="236" height="21" border="0" id="bild" onload="MM_nbGroup('init','group1','bild','../../img/subnav/cultureat-bild.gif',1)" /></a><br><a href="javascript:;" target="_self" onclick="MM_nbGroup('down','group1','film','../../img/subnav/cultureat-film02.gif',1)" onmouseover="MM_nbGroup('over','film','../../img/subnav/cultureat-film02.gif','',1)" onmouseout="MM_nbGroup('out')"><img src="../../img/subnav/cultureat-film.gif" alt="film" name="film" width="236" height="21" border="0" id="film" onload="" /></a><br><a href="javascript:;" target="_self" onclick="MM_nbGroup('down','group1','lit','../../img/subnav/cultureat-lit02.gif',1)" onmouseover="MM_nbGroup('over','lit','../../img/subnav/cultureat-lit02.gif','',1)" onmouseout="MM_nbGroup('out')"><img src="../../img/subnav/cultureat-lit.gif" alt="literatur" name="lit" width="236" height="21" border="0" id="lit" onload="" /></a><br><a href="javascript:;" target="_self" onclick="MM_nbGroup('down','group1','mus','../../img/subnav/cultureat-mus02.gif',1)" onmouseover="MM_nbGroup('over','mus','../../img/subnav/cultureat-mus02.gif','',1)" onmouseout="MM_nbGroup('out')"><img src="../../img/subnav/cultureat-mus.gif" alt="musik" name="mus" width="236" height="21" border="0" id="mus" onload="" /></a><br><a href="javascript:;" target="_self" onclick="MM_nbGroup('down','group1','tanz','../../img/subnav/cultureat-tanz02.gif',1)" onmouseover="MM_nbGroup('over','tanz','../../img/subnav/cultureat-tanz02.gif','',1)" onmouseout="MM_nbGroup('out')"><img src="../../img/subnav/cultureat-tanz.gif" alt="tanz" name="tanz" width="236" height="21" border="0" id="tanz" onload="" /></a><br><a href="javascript:;" target="_self" onclick="MM_nbGroup('down','group1','theater','../../img/subnav/cultureat-theater02.gif',1)" onmouseover="MM_nbGroup('over','theater','../../img/subnav/cultureat-theater02.gif','',1)" onmouseout="MM_nbGroup('out')"><img src="../../img/subnav/cultureat-theater.gif" alt="theater" name="theater" width="236" height="21" border="0" id="theater" onload="" /></a><br><a href="javascript:;" target="_self" onclick="MM_nbGroup('down','group1','bib','../../img/subnav/cultureat-bib02.gif',1)" onmouseover="MM_nbGroup('over','bib','../../img/subnav/cultureat-bib02.gif','',1)" onmouseout="MM_nbGroup('out')"><img src="../../img/subnav/cultureat-bib.gif" alt="bibliotheken" name="bib" width="236" height="21" border="0" id="bib" onload="" /></a><br><a href="javascript:;" target="_self" onclick="MM_nbGroup('down','group1','wis','../../img/subnav/cultureat-wissen02.gif',1)" onmouseover="MM_nbGroup('over','wis','../../img/subnav/cultureat-wissen02.gif','',1)" onmouseout="MM_nbGroup('out')"><img src="../../img/subnav/cultureat-wissen.gif" alt="wissen" name="wis" width="236" height="21" border="0" id="wis" onload="" /></a><br><a href="javascript:;" target="_self" onclick="MM_nbGroup('down','group1','inst','../../img/subnav/cultureat-inst02.gif',1)" onmouseover="MM_nbGroup('over','inst','../../img/subnav/cultureat-inst02.gif','',1)" onmouseout="MM_nbGroup('out')"><img src="../../img/subnav/cultureat-inst.gif" alt="institutionen" name="inst" width="236" height="21" border="0" id="inst" onload="" /></a><br><a href="javascript:;" target="_self" onclick="MM_nbGroup('down','group1','med','../../img/subnav/cultureat-medien02.gif',1)" onmouseover="MM_nbGroup('over','med','../../img/subnav/cultureat-medien02.gif','',1)" onmouseout="MM_nbGroup('out')"><img src="../../img/subnav/cultureat-medien.gif" alt="medien" name="med" width="236" height="21" border="0" id="med" onload="" /></a>
 </div>

bitte um zahlreiche wortspenden.

urlaut · #9 (**permalink**) 25.01.2010, 11:15

gibt's hier wirklich niemand mit irgnedeiner ahnung, was genau da das problem
ist?

an der von cocoon genannten table im div liegt's nun definitiv nicht mehr, weil
da keine table mehr ist, im div.

danke im voraus,
u.

Cocoon · #10 (**permalink**) 25.01.2010, 11:49

1. Schritt:

Sorge dafür, dass deine Seite valide ist. Es ist schwer für die Leute Fehler im Code zu finden wenn die Seite nicht geltenden Standards entspricht.

W3C Markup Validator - 8 Errors, 41 warnings

2. Schritt:

Baue eine vernünftige Navigation. Sehr wahrscheinlich verschwindet das Problem dann von selbst.

Erstellung von vertikalen Navigationsmenüs mit Listen

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
IE7 Anzeigeproblem	jetwes	CSS	6	17.02.2010 18:03
Anzeigeproblem bei IE7 (ausschließlich)	nataq	CSS	6	21.11.2008 22:00
IE7 fixing - expandable menu	matsie	CSS	6	10.04.2008 15:55
CSS-basiertes Menü fehlerhaft im IE7	otomo	CSS	0	16.10.2007 16:56
Problem mit Dastellung in IE7 und FF	ConiKost	CSS	1	05.07.2006 12:59