nicht angemeldet
CSS wird im IE für Navigation falsch umgesetzt
Gunnar BittersmannHi @all...
ich hoffe hier auf etwas Hilfe für einen Laien in Sachen Programmierung... Vorab muss ich noch erwähnen, das ich meine Seiten mit NOF Fusion 10 erstellt habe... Ich weiss das da nun viele aufschreien, aber jeder muss doch erstmal anfangen... Und ein HTML Generator war das, was mir die ersten Schritte erleichtert hat... Ein HTML Editor ist sicher etwas anderes... Aber nichts desto trotz...
Ich habe nun meine Seiten neu online gestellt... Die Validierung zeigt mir zwar noch einige Fehler, die sollen aber laut dem NOF Forum keine Auswirkungen auf mein Problem haben... Also:
Auf obiger Seite sieht man eine Seite auf der mein Problem besonders zuschlägt... Firefox zeigt die Navigation auf der linken Seite wie gewünscht... Der IE dagegen überhaupt nicht... Nun kann ich nur spekulieren, ob Firefox etwas falsch macht und es dadurch "richtig" anzeigt, oder aber der IE etwas zerschiesst... Folgender Code liegt all dem zugrunde...:
#navi {
position: absolute;
width: 165px;
top: 150px;
}
#navi li {position: relative;}
#navi ul {
display: block;
width: 120px;
list-style: none;
padding: 0;
}
#navi a, #navi span {
display: block;
height: 16px;
padding: 15px 0px 20px 5px;
text-decoration: none;
color: #999999;
font: bold 12px arial, helvetica, sans-serif;
background-repeat: no-repeat;
background-position: top right;
}
#navi a:active, #navi a:focus {outline: none;}
#navi ul ul span, #navi ul ul a {
display: block;
width:140px;
height: 14px;
padding: 15px 0px 18px 5px;
margin-left: 20px;
border-bottom: 1px solid #777777;
text-decoration: none;
font: bold 11px arial, helvetica, sans-serif;
color: #999999;
background-repeat: no-repeat;
background-position: top right;
}
#navi ul a:hover, #navi ul span:hover {color: #bdb177;}
#navi ul ul ul a , #navi ul ul ul span {
display: block;
width: 70px;
height: 15px;
padding: 8px 0px 5px 10px;
margin-left: 85px;
border-bottom: 1px solid #777777;
color: #bdb177;
font: bold 11px arial, helvetica, sans-serif;
text-align: right;}
#navi ul ul ul a:hover, #navi ul ul ul span:hover {
color: #777777;
}
#navi ul ul ul,
#navi ul ul,
#navi ul li:hover ul ul,
#navi ul li.issliste ul ul
{display: none;}
#navi ul li:hover ul,
#navi ul ul li:hover ul,
#navi ul li.issliste ul
{display: block;}
Und der HTML Code für die Listen:
<div id="navi">
<ul>
<li><a id ="home" href="../index.html">Home</a></li>
<li></li>
<li><a id="raum" href="./raumfahrt.html">Raumfahrt</a>
<ul>
<li><a id="shuttle" href="./shuttle.html">Space Shuttle</a></li>
<li><a id="ground" href="./ground.html">Ground Control</a></li>
<li><a id="const" href="./2018.html">Constellation</a></li>
<li><a id="gloss" href="./glossar.html">Glossar</a></li>
</ul>
</li>
<li class="issliste"><span id="iss">ISS</span>
<ul>
<li><a id="chronik" href="./1998.html">Chronik</a></li>
<li><span id="module">Module</span>
<ul>
<li><span>Columbus</span></li>
<li><span>Kibo</span></li>
<li><span>Destiny</span></li>
<li><span>Harmony</span></li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
Egal was ich nun mit meinen Laienhaften Wissen probiere, ich "verschlimmbessere" es dadurch nur noch... Meistens passt es dann im Firefox auch nicht mehr... Und da ich langsam den Wald vor lauter Bäumen nicht mehr sehe hoffe ich hier nun auf etwas Hilfestellung bei meinem Problem...
Gruss Mac
-
@@macmensa:
nuqneH
Firefox zeigt die Navigation auf der linken Seite wie gewünscht... Der IE dagegen überhaupt nicht... Nun kann ich nur spekulieren, ob Firefox etwas falsch macht und es dadurch "richtig" anzeigt
Die Spekulation, dass Firefox etwas falsch macht, haben schon viele gewagt. Die allermeisten hatten Unrecht.
oder aber der IE etwas zerschiesst...
Den Grund dafür solltest du wissen. (Ersetze dort '<' durch '≤'.)
Du wolltest dich der Thematik Quirksmodus doch widmen. Was ist dabei herausgekommen?
Qapla'
--
Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)-
Hallo Gunnar,
Du wolltest dich der Thematik Quirksmodus doch widmen. Was ist dabei herausgekommen?
ich habe mich wirklich etwas damit beschäftigt, komme aber leider zu keiner praktikablen Lösung mit meinem Wissen... Bedingt durch meine Arbeitsumgebung mit NOF 10... Dieses generiert den Doctype automatisch und gibt mir keine Option der Änderung... Und soweit ich das verstanden habe ist der Doctype das ausschlaggebende für den Quirksmodus... Solange ich also mit NOF arbeite scheint das nicht zu lösen zu sein... Leider...
oder aber der IE etwas zerschiesst...
Den Grund dafür solltest du wissen. (Ersetze dort '<' durch '≤'.)
Ja und nein... In der CSS Definition soll ich dieses Symbol "<" ersetzen?
<style type="text/css"> </style>Denn es taucht ja nur in der Einleitung und beim schliessen auf... Da stellt sich aber gerade die ganz dumme Frage wie ich dieses Sonderzeichen a) erzeuge und b) wird das dann vom Firefox auch wieder "normal" interpretiert... und c) würde mich tatsächlich gerade die Logik hinter dieser Fehlinterpretierung interessieren um den Fehler verstehen zu können... Sorry für die DAU-Fragen...
Ansonsten hatte mir deine Hilfestellung im anderen Thread ja sehr erfolgreich weiter gebracht wie man an dem Endresultat hoffentlich auch erkennen kann... Danke nochmals dafür....
Gruss Mac
-
Hi,
oder aber der IE etwas zerschiesst...
Den Grund dafür solltest du wissen. (Ersetze dort '<' durch '≤'.)
Ja und nein... In der CSS Definition soll ich dieses Symbol "<" ersetzen?
Nein. Im Text der verlinkten Stelle, wo < im Sinne von "kleiner als" auftaucht.
MfG ChrisB
--
Light travels faster than sound - that's why most people appear bright until you hear them speak.-
Hallo Chris;
Nein. Im Text der verlinkten Stelle, wo < im Sinne von "kleiner als" auftaucht.
öhm... mit der Intention "kleiner als" ist das aber doch niergends an der verlinkten Stelle... Der Link steht ja in der Liste im HTML der Seite..
<div id="navi"> <ul> <li><a id ="home" href="../index.html">Home</a></li> <li></li> <li><a id="raum" href="./raumfahrt.html">Raumfahrt</a> <ul> <li><a id="shuttle" href="./shuttle.html">Space Shuttle</a></li> <li><a id="ground" href="./ground.html">Ground Control</a></li> <li><a id="const" href="./2018.html">Constellation</a></li> <li><a id="gloss" href="./glossar.html">Glossar</a></li> </ul> </li> <li class="issliste"><span id="iss">ISS</span> <ul> <li><a id="chronik" href="./1998.html">Chronik</a></li> <li><span id="module">Module</span> <ul> <li><span>Columbus</span></li> <li><span>Kibo</span></li> <li><span>Destiny</span></li> <li><span>Harmony</span></li> </ul> </li> </ul> </li> </ul> </div>Übersehe ich da gerade was? Komme mir da gerade etwas blöd vor, das ich eure Hinweise anscheinend nicht verstehe... Sorry...
Gruss Mac
-
Hi,
Nein. Im Text der verlinkten Stelle, wo < im Sinne von "kleiner als" auftaucht.
öhm... mit der Intention "kleiner als" ist das aber doch niergends an der verlinkten Stelle... Der Link steht ja in der Liste im HTML der Seite..
Niemand redet von deinem HTML-Code. Wri reden von der Stelle in einem Thread im Archiv, auf den Gunnar verlinkt hat.
MfG ChrisB
--
Light travels faster than sound - that's why most people appear bright until you hear them speak.-
Hi Chris..
Niemand redet von deinem HTML-Code. Wri reden von der Stelle in einem Thread im Archiv, auf den Gunnar verlinkt hat.
Ah.. ok.. Dann geht es also wieder um das Thema Quirksmodus... Und um mein altes Problem, das ich darauf keinen Einfluss habe, leider... Durch Nof10 wird der Doctype automatisch generiert...
Wenn also mein Darstellungsproblem dadurch entsteht, habe ich ein grundsätzliches Problem... Gibt es dann eine Möglichkeit im Head der Seite mit einem Workaround Einfluss auf die Darstellung zu nehmen? Oder verstehe ich schon wieder etwas falsch?
Gruss Mac
-
Hi,
Ah.. ok.. Dann geht es also wieder um das Thema Quirksmodus... Und um mein altes Problem, das ich darauf keinen Einfluss habe, leider... Durch Nof10 wird der Doctype automatisch generiert...
Es ist doch deine Entscheidung, dieses ominöse "Nof10" einzusetzen - also hast du auch Einfluss darauf.
MfG ChrisB
--
Light travels faster than sound - that's why most people appear bright until you hear them speak.-
Yerf!
Es ist doch deine Entscheidung, dieses ominöse "Nof10" einzusetzen - also hast du auch Einfluss darauf.
naja, ist so ne Sache... der Umstieg von Fusion auf "handamde" HTML ist nicht so einfach... aber er lohnt sich!
(ich spreche aus eigener Erfahrung)
Manchmal vermisse ich zwar ein paar der Features von Fusion, aber leider sperrt sich das Teil gegen jegliche Eingriff in den HTML-Code (der von den Entwicklern nicht explizit vorgesehen wurde).
Gruß,
Harlequin
--
RIP --- XHTML 2
nur die Besten sterben jung-
Hi ihr beiden...
Es ist doch deine Entscheidung, dieses ominöse "Nof10" einzusetzen - also hast du auch Einfluss darauf.
naja, ist so ne Sache... der Umstieg von Fusion auf "handamde" HTML ist nicht so einfach... aber er lohnt sich!
Sicher habt ihr beide recht damit... Aber als Änfanger will und kann ich es momentan nicht missen, trotz einiger offensichtlicher Nachteile... Und einiges auf der Seite habe ich ja bereits unter Umgehung der NOF-Code-Genierierung aufgebaut dank der Hilfe hier im Forum...
Nichts desto trotz bin ich dadurch einer Lösung ja leider noch keinen Schritt näher gekommen... Geschweige denn einer Erklärung worin der Darstellungsfehler überhaupt begründet ist...
Gibt es eine Möglichkeit durch Veränderung des CSS Codes oder durch einen Workaround den ich einfüge mein Darstellungsproblem zu beheben? Wenn die Antwort definitiv "NEIN" ist durch die Tatsache von NOF, dann muss ich erstmal damit Leben... Die Seite ist in sofern ja auch ein privates Hobby und kein gewerbliches Projekt...
Oder ist die Anwort "JA", dann hoffe ich immer noch auf Hilfe durch einen Lösungsansatz...
Gruss Mac
-
Yerf!
Nichts desto trotz bin ich dadurch einer Lösung ja leider noch keinen Schritt näher gekommen... Geschweige denn einer Erklärung worin der Darstellungsfehler überhaupt begründet ist...
Die Frage ist auch, was genau der Fehler eigentlich ist. Im ersten Posting sagst du, das man im IE das Menü gar nicht sieht. Hier im IE6 sehe ich es aber, allerdings teilweise vom mittleren Inhalt überdeckt. Das könnte daher kommen, dass der IE im Quirksmodus die Breiten anders berechnet, wenn Rahmen und/oder Padding ins Spiel kommt und wäre evtl. per CSS-Hack sogar behebbar.
Allerdings ist der von NOF generierte Code derart unübersichtlich, dass ich darin nicht wirklich viel erkennen kann.
Gruß,
Harlequin
--
RIP --- XHTML 2
nur die Besten sterben jung-
Hi Harlequin..
Im ersten Posting sagst du, das man im IE das Menü gar nicht sieht. Hier im IE6 sehe ich es aber, allerdings teilweise vom mittleren Inhalt überdeckt.
Das war missverständlich formuliert, sorry... Ja, man sieht sie, jedoch verdeckt oder aber manchmal auch über dem Inhalt liegend, wodurch dieser unleserlich ist.
Das könnte daher kommen, dass der IE im Quirksmodus die Breiten anders berechnet, wenn Rahmen und/oder Padding ins Spiel kommt und wäre evtl. per CSS-Hack sogar behebbar.
Diese kommen wirklich ins Spiel, dank der Hilfe von Gunnar in dem anderen angesprochenen Thread.
Allerdings ist der von NOF generierte Code derart unübersichtlich, dass ich darin nicht wirklich viel erkennen kann.
Im Eingangspost habe ich den selbst erstellten und für die Navigation relevanten HTML und CSS Code gepostet... Will das hier nun nicht nochmals einfügen, aber dort könnte das padding, margin und Breiten Thema für die Experten ersichtlich sein denke ich... Und somit lebe ich immer noch in der Hoffnung das eventuell durch einen hack beseitigen zu können...
In meiner "Verzweiflung" habe ich nun meinen Internet Explorer mal auf 8 upgedatet, aber auch dort ist der Anzeigefehler identisch... Einziges Problem ist nun, das ich mir selbst gar keine Vorschau mit IE 6 anzeigen lassen kann...
Gruss Mac
-
Yerf!
Im Eingangspost habe ich den selbst erstellten und für die Navigation relevanten HTML und CSS Code gepostet... Will das hier nun nicht nochmals einfügen, aber dort könnte das padding, margin und Breiten Thema für die Experten ersichtlich sein denke ich... Und somit lebe ich immer noch in der Hoffnung das eventuell durch einen hack beseitigen zu können...
Ich habs mir grad nochmal angeschaut. Das ist ganz schön verstrickt. Die Navi ist per absoluter Positionierung ausgerichtet und 165px breit. Der mittlere Teil wird über mehrere verschachtelte Tabellen ausgerichtet (vermutlich von NOF erstellt). Dabei taucht eine Tabellenzelle als Platzhalter für die Navi auf, die aufgrund der inneren Tabelle 153px breit ist. (Diese Tabelle enthält unter anderem auch den weiter unten erscheinenden Link auf den interaktiven Rundgang). Ich denk mal, dass die 153px beim FF noch ausreichen und beim IE zu wenig sind. Eine einfache Lösung, außer die Spalte einfach breiter zu ziehen, fällt mir nicht ein (dann hat man im FF halt etwas viel Abstand).
In meiner "Verzweiflung" habe ich nun meinen Internet Explorer mal auf 8 upgedatet, aber auch dort ist der Anzeigefehler identisch... Einziges Problem ist nun, das ich mir selbst gar keine Vorschau mit IE 6 anzeigen lassen kann...
Solange der IE im Quirksmode ist wird er sich immer wie eine Version 5 verhalten, auch wenn es der ganz neue 8er ist.
Gruß,
Harlequin
--
RIP --- XHTML 2
nur die Besten sterben jung-
Hi Harlequin..
Dabei taucht eine Tabellenzelle als Platzhalter für die Navi auf, die aufgrund der inneren Tabelle 153px breit ist. (Diese Tabelle enthält unter anderem auch den weiter unten erscheinenden Link auf den interaktiven Rundgang). Ich denk mal, dass die 153px beim FF noch ausreichen und beim IE zu wenig sind. Eine einfache Lösung, außer die Spalte einfach breiter zu ziehen, fällt mir nicht ein (dann hat man im FF halt etwas viel Abstand).
Vielen Dank für deine Bemühungen..! Nun habe ich zumindest einen Anhaltspunkt wo ich ansetzen kann... Am Wochenende werde ich mich damit dann mal näher beschäftigen...
Gruss Mac
-
-
-
-
-
-
-
-
-
-
-
-