Fuchspower: Anzeigeprobleme bei anderen Browsern

Um den Bereich eines Klappfensters (javascript: toggle) hervorzuheben und so sichtbar zu machen, habe ich den jeweiligen Bereich mit css (p border; background-color) farbig umrahmt. Das Ziel dabei war, dass bei display des Inhaltes (in meinem Fall lediglich Text und Bilder) sich vergrößert und somit den gesamten Inhalt umrahmt.

Bei Firefox funktioniert auch alles wunderbar. Als ich jedoch mit der Darstellung von Opera und Windows Explorer verglich, fiel mir auf, dass beim Ausklappen nur der Text, durch dessen Klick der Inhalt aufgerufen wird, umrahmt ist und nicht, wie gewünscht, der Text.

  
  
  <script language="javascript"><!--  
function toggle(control)  
{  
var elem = document.getElementById(control);  
if(elem.style.display == "none")  
{  
elem.style.display = "block";  
}  
else  
{  
elem.style.display = "none";  
}  
}  
//-->  
  </script>  
  <style type="text/css">  
p.sw { border:1px solid black; background-color:#99FF66; padding:4px; margin-left:5px; width:80% }  
  </style>  
<body>  
<p class="sw">  
      <a href="javascript:toggle('Klapp1')">Erdgeschoss</a>  
      <div id="Klapp1" style="display: none;"><br>  
  
Inhalt des Klappbereiches.  
  
</div></p>  
  

Der Code ist stark zerpflückt, jedoch ist im Link meine Seite angegeben, die das Script verwendet.

  1. Hi,

    Bei Firefox funktioniert auch alles wunderbar. Als ich jedoch mit der Darstellung von Opera und Windows Explorer verglich, fiel mir auf, dass beim Ausklappen nur der Text, durch dessen Klick der Inhalt aufgerufen wird, umrahmt ist und nicht, wie gewünscht, der Text.

    Das wird wohl daran liegen, dass diese die Verschachtelungsfehler in deinem Quelltext anders korrigieren.

    <p class="sw"><span style="rahmen">  
          <font size="+3"><a href="javascript:toggle('EG')">Erdgeschoss</a></font>  
          <div id="EG" style="display: none;"><br>
    

    Das Inline-Element SPAN darf kein Block-Element wie DIV enthalten, und auch P darf kein DIV enthalten.
    Die Browser müssen also aus diesem Murks irgendwie etwas machen, was sie darstellen können - und das können sie bspw. machen, in dem sie Elemente, die keine der nachfolgenden enthalten dürfen, vorher wieder schliessen.

    Der Code ist stark zerpflückt, jedoch ist im Link meine Seite angegeben, die das Script verwendet.

    Der Code ist sogar stark beschi..., ähm, von sehr bescheidener Qualität.
    Fehler über Fehler - da ist es kein Wunder, wenn es nicht in jedem Browser so dargestellt wird, wie du es dir wünschst.

    Beseitige die Fehler;
    und lerne mal, CSS vernünftig einzusetzen - damit werden nämlich auch die zahlreichen FONT-Elemente und einiges von dem weiteren Quatsch überflüssig.

    MfG ChrisB

    --
    “Whoever best describes the problem is the person most likely to solve the problem.” [Dan Roam]
    1. Die Antwort kommt zwar ein wenig spät (hatte keine Zeit), aber ich möchte einmal zeigen, wie "nützlich" dieser Post über mir dann doch im Endeffekt war.

      Das Inline-Element SPAN darf kein Block-Element wie DIV enthalten, und auch P darf kein DIV enthalten.
      Die Browser müssen also aus diesem Murks irgendwie etwas machen, was sie darstellen können - und das können sie bspw. machen, in dem sie Elemente, die keine der nachfolgenden enthalten dürfen, vorher wieder schliessen.

      Das war die einzig-nützliche Stelle, für die ich auch dankbar bin (meine erste Arbeit mit CSS, wohlgemerkt). Der restliche Post besteht aus "dein Script ist kacke". Mein Script befindet sich im Frühstadium und ich überarbeite nicht alles gründlich, bevor ich nicht weiß, ob das dann im Endeffekt alles sinnlos ist. Eine alternative Lösung? Fehlanzeige!

      Fehler über Fehler - da ist es kein Wunder, wenn es nicht in jedem Browser so dargestellt wird, wie du es dir wünschst.

      Bevor ich auf die einzelnen Fehler eingehe, möchte ich erst einmal einige Vergleichsbeispiele zeigen

      So, gehen wir jetzt auf meine Fehler ein:
      Der erste Fehler ist eine unzureichende Definition für das Javascript. Sehr traurig, der Code ist von einer Hilfeseite über Java 1zu1 kopiert.
      Die folgenden ~5 Fehler sind von dem AD, für das ich keine Verantwortung trage, da funpic (ein kostenloser Webspaceanbieter, falls du es noch nie gehört hast) diesen Code automatisch einfügt.
      Die übrigen Fehler wiederholen sich, immerhin ist das das gleiche Script (Stichwort: copypaste). Also kann man die verbleibenden schonmal durch 14 teilen. Nun muss man auch bedenken, dass man für den gleichen Fehler 2 Meldungen erhält ("div darf nicht in p oder s" und "in p oder s darf kein div"). Übrig bleiben also die Definition, dass div-Tags nicht in p/span-tags und umgekehrt dürfen und eine mangelhafte tag-Deklaration, die aber noch später dabei gewesen wäre (s. weiter oben).

      Beseitige die Fehler;

      Fazit1: Selbst, WENN ich alle Fehler beseitigen könnte (könnte bitte überbetonen, ansonsten klingts nicht so schön), wäre mein Problem trotzdem nicht gelöst.
      Fazit2: Die Seite, die die Scriptfehler überprüft, ist gut dazu, wenn man ein Scriptfehler hat, den man nicht zu finden vermag, aber nicht dazu, dass man definieren kann, ob eine Seite "gut" oder "schlecht" ist.

      Also, lieber ChrisB: Lerne bitte, wie man einen Beitrag vernünftig strukturiert und gut argumentiert, bevor du postest. Und beachte bitte, wenn du schon festgestellt hast, dass ein Code nicht funktionieren KANN, du einen Alternativvorschlag anbietest oder du zumindest darauf aufmerksam machst, dass ein Problem nicht lösbar ist (sehe ich nicht als Beleidigung, sondern als Hinweis, wie ein Post strukturiert sein sollte).

      P.S.: Ich möchte darauf hinweisen, dass einige Elemente dieses Posts ironisch gemeint sind und mich dafür entschuldigen, wenn ich beleidigend wirke - das möchte ich nicht. Sollte ich es tun, so müsste der Post des zuletzt Postenden auch beleidigend sein (Dein Script ist Scheiße. Lern erstmal CSS, bevor du was tust). Und sollte das Team dennoch der Meinung sein, dass mein Post gelöscht gehört (was ich euch nicht übel nehme, Job ist Job), dann gebt ihm zumindest die Gelegenheit, dass er diesen Post lesen kann.

      MfG, Fuchspower

      1. Hallo Fuchs,

        Das Inline-Element SPAN darf kein Block-Element wie DIV enthalten, und auch P darf kein DIV enthalten.
        Die Browser müssen also aus diesem Murks irgendwie etwas machen, was sie darstellen können - und das können sie bspw. machen, in dem sie Elemente, die keine der nachfolgenden enthalten dürfen, vorher wieder schliessen.
        Das war die einzig-nützliche Stelle

        logisch, viel mehr hat Chris ja auch nicht geschrieben.

        für die ich auch dankbar bin (meine erste Arbeit mit CSS, wohlgemerkt).

        Das ist aber kein CSS-Fehler, sondern ein HTML-Fehler. Vom CSS-Standpunkt her ist das egal.

        Der restliche Post besteht aus "dein Script ist kacke". Mein Script befindet sich im Frühstadium und ich überarbeite nicht alles gründlich, bevor ich nicht weiß, ob das dann im Endeffekt alles sinnlos ist.

        Das ist aber eine ungünstige Strategie. Warum fängst du erst quick&dirty an, und nachher musst du nochmal drangehen und saubermachen?

        Eine alternative Lösung? Fehlanzeige!

        Ach?

        "Das Inline-Element SPAN darf kein Block-Element wie DIV enthalten, und auch P darf kein DIV enthalten." [...] Beseitige die Fehler

        Damit hat Chris den eigentlichen Fehler klar aufgezeigt. Was erwartest du noch? Dass er dir deinen Code korrigiert?

        Bevor ich auf die einzelnen Fehler eingehe, möchte ich erst einmal einige Vergleichsbeispiele zeigen

        Ja, es ist kein Geheimnis, dass auch die Webauftritte großer Unternehmen teilweise vor technischen, logischen und ergonomischen Fehlern strotzen. Das sollte man sich aber nicht als Vorbild nehmen (oder als Entschuldigung).

        So, gehen wir jetzt auf meine Fehler ein:
        Der erste Fehler ist eine unzureichende Definition für das Javascript. Sehr traurig, der Code ist von einer Hilfeseite über Java 1zu1 kopiert.

        Java hat allerdings mit Javascript nichts zu tun.

        Die folgenden ~5 Fehler sind von dem AD, für das ich keine Verantwortung trage, da funpic (ein kostenloser Webspaceanbieter, falls du es noch nie gehört hast) diesen Code automatisch einfügt.

        Stimmt.

        Also kann man die verbleibenden schonmal durch 14 teilen. Nun muss man auch bedenken, dass man für den gleichen Fehler 2 Meldungen erhält ("div darf nicht in p oder s" und "in p oder s darf kein div"). Übrig bleiben also die Definition, dass div-Tags nicht in p/span-tags und umgekehrt dürfen und eine mangelhafte tag-Deklaration, die aber noch später dabei gewesen wäre (s. weiter oben).

        Übrig bleibt vor allem, dass du an mehreren Stellen fehlerhaftes HTML hast, indem du Blockelemente innerhalb von Inline-Elementen notierst. Am Ende des Quellcodes sehe ich sogar drei schließende Tags </p> hintereinander; die zugehörigen Start-Tags zu suchen, ist mir im Moment zu mühsam. Aber das heißt, du hast hier außerdem p-Elemente mehrfach verschachtelt - auch ein grober Fehler. Ein p-Element darf nur inline-Inhalt haben.
        Das muss ein Browser also "irgendwie" korrigieren; wie die browserinterne Korrektur aussieht, kann von Browser zu Browser unterschiedlich sein. Auf eine solche fehlerhafte Struktur mit CSS aufzusetzen, ist schließlich reine Glückssache.

        Daher ist der Hinweis "Beseitige erst die Fehler im HTML, dann sehen wir weiter" absolut angebracht.

        Fazit2: Die Seite, die die Scriptfehler überprüft, ...

        Du meinst den W3C-Validator? Der überprüft keine Scriptfehler. Der überprüft nur HTML auf Korrektheit, auf Wunsch auch CSS.

        aber nicht dazu, dass man definieren kann, ob eine Seite "gut" oder "schlecht" ist.

        Stimmt, über die Qualität sagt der Validator nichts aus. Ein HTML-Dokument kann vollkommen valide sein, aber trotzdem grausam. Validität ist aber eine Grundvoraussetzung.

        Also, lieber ChrisB: Lerne bitte, wie man einen Beitrag vernünftig strukturiert und gut argumentiert, bevor du postest.

        Du hast entweder den Sinn dieses Forums oder die Antwort von Chris nicht verstanden.

        So long,
         Martin

        --
        Denken ist wohl die schwerste Arbeit, die es gibt. Deshalb beschäftigen sich auch nur wenige damit.
          (Henry Ford, amerikanischer Industriepionier)
        1. Lieber Martin,

          herzlichen Glückwunsch, ihr Beitrag wurde als "erbärmlich" eingestuft!
          (Ich lasse das Script mal außen vor, aber ich hab einfach LUST, hier zu schreiben, deswegen macht doch, was ihr wollt ^_^)

          Ich könnte jetzt weitermachen, wie du es bereits davor gemacht hast: deinen Beitrag ins Lächerliche ziehen. Was würdest du tun? Entweder würdest du wiederum gleiches tun oder es würde Konsequenzen für mich haben - ist mir egal, hab keine Interesse in dem Forum (ich gehöre zu der Sorte Leute, die einmal ne Frage stellen, ne antwort kriegen und danach nie wiederkommen). Bin vom Anfang an im Nachteil. Stattdessen spamme ich ein wenig (konstruktiver Spam, kein fefkjrdnk jcscfjsdthlsfdukjkdlgfidgfhmasgob-Spam).

          Ich rede über das Forum:

          Ich habe mir mal einige Beiträge durchgelesen, von anderen. Was ich sah, war ja wohl mal eine Unverschämtheit. Da werden User runtergemacht, das ist nicht mehr normal. Also ich lasse hier mein Fazit ab: selfhtml ist gut, sogar richtig gut. Gibt es lange und hat gute erklärungen, die sogar Leute verstehen, die plötzlich vor der Aufgabe stehen, eine Internetseite zu erstellen, ohne irgendeine Ahnung von Computern zu haben (kurz: deutsches Bildungssystem). Ein großes Lob also ^_^

          Jede schöne Sache hat auch ihre Schattenseite. Im Falle von selfhtml ist das das Forum. Hier hat man User, die Neulinge eiskalt runtermacht (ich würde mich zwar nicht als Neuling bezeichnen, aber ihr tut es bei mir bestimmt trotzdem, IHR SEID JA SO VORRAUSSEHBAR!) und sich dann an seiner Charta festhält, die einem vermitteln soll, dass die Beleidigenden Leute sind, auf die die Moderation nicht achtet und sie deshalb machen können, was sie wollen (ich meinte eigentlich keine Bettgeschichten, aber gute Idee ;) ). Mal ganz abgesehen von der Struktur (ich finde sie Mist) ist vor allem die Community, wie man in Fachkreisen sagen würde, "total im Arsch". Tut mir echt Leid für euch ^_^ Was, du hast so weit gelesen, ohne kommentarlos zu löschen oder wegzuklicken? Glückwunsch, hier ist ein Keks :3

          1. Mahlzeit Fuchspower,

            herzlichen Glückwunsch, ihr Beitrag wurde als "erbärmlich" eingestuft!

            Kannst Du mir bitte kurz helfen? Ich finde die Stelle nicht, an der Martins Beitrag erbärmlich ist ...

            MfG,
            EKKi

            --
            sh:( fo:| ch:? rl:( br:> n4:~ ie:% mo:} va:) de:] zu:) fl:{ ss:) ls:& js:|
      2. Hi,

        Der restliche Post besteht aus "dein Script ist kacke". Mein Script befindet sich im Frühstadium und ich überarbeite nicht alles gründlich, bevor ich nicht weiß, ob das dann im Endeffekt alles sinnlos ist.

        Es ist im Endeffekt absolut sinnlos, sich mit „das funzt doch so“ zufrieden zu geben, statt sich gleich zu bemühen, es *richtig* zu machen.

        Leute mit längerer Erfahrung im Erstellen von Webseiten wissen das - zum grossen Teil aus eigenem Erleben.
        Also ist es doch angebracht, das Wissen um diesen Umstand an Neulinge weiterzugeben.

        Eine alternative Lösung? Fehlanzeige!

        Dieses Forum ist nicht dazu da, dir fertige Lösungen auf dem Silbertablett zu servieren.

        Du sollst selbst darüber nachdenken (lernen), warum manche Lösungen schlecht sind, und welche Alternativen sich besser eignen könnten.

        Also, lieber ChrisB: Lerne bitte, wie man einen Beitrag vernünftig strukturiert und gut argumentiert, bevor du postest.

        Been there, done that.

        Und beachte bitte, wenn du schon festgestellt hast, dass ein Code nicht funktionieren KANN, du einen Alternativvorschlag anbietest oder du zumindest darauf aufmerksam machst, dass ein Problem nicht lösbar ist (sehe ich nicht als Beleidigung, sondern als Hinweis, wie ein Post strukturiert sein sollte).

        Nein, so sollen meine Antworten bitte nicht strukturiert sein.

        Dass du bereit bist, ohne gross darüber nachzudenken etwas zu kopieren, was du irgendwo findest, hast du bereits gezeigt.
        Jetzt musst du lernen, solche Sachen selber zu bewerten.

        MfG ChrisB

        --
        “Whoever best describes the problem is the person most likely to solve the problem.” [Dan Roam]