Wuffy: Browserunabhängiger Browserbug...

Moin,

man nehme etwas XHTML:

...
<body>
....
<div id="seite">
  ...
  <div class="rightfloat">
    ...
    <div class="news-list">
    ...
    <ul>
       <li><a href="...">
           <b>Überschrift</b>
           <em>Datum</em>
           <span>Text</span>
           </a></li>
       <li>....
    </ul>
    </div>
    ...
    </div>
</div>

und formatiere dies mit einer ganzen Menge CSS. Ist das zuviel verlangt? Die gesamte Seite zeigen aktuelle Operas, IEs sowie Mozillas wunderbar an, doch jetzt, wo eine kleine Liste wie in dem Codeauszug oben kommt, versagen sie.

Verdeutlichende Styles:

#seite .news-list ul {
    margin: 0;
    padding: 0;
}

#seite .news-list li {
    margin: 5px;
    padding: 0;
    list-style-type: none;
}

#seite .news-list li a {
    display: block;
    padding: 4px;
    border: 1px solid black;
    clear: both;
    text-decoration: none;
}

#seite .news-list li a:link, #seite .news-list li a:visited {
}

#seite .news-list li a:hover {
}

#seite .news-list li a:active, #seite .news-list li a:focus {

}

#seite .news-list li strong {
    font-size: 100%;
    font-weight: bold;
    display: block;
    float: left;
}

#seite .news-list li em {
    font-style: italic;
    display: block;
    float: right;
}

#seite .news-list li span {
    clear: both;
}

Das ist selbstverständlich nur ein Rohgerüst, aber wohl kaum etwas zu viel verlangt, oder?

Ich habe mir die Freiheit genommen, die Umsetzung dieser Styles in den drei genannten Browsern zu fotografieren, um sie hier als bildchen anzuzeigen:

<img src="http://sveni.dnsalias.net/forum/svwebsrv.anzeige-mozilla.png" border="0" alt="">

Mozilla-Rendering. Sieht noch am Besten aus, obwohl hier unübersehbar völlig ignoriert wird, dass "list-style-type" auf "none" gesetzt wurde. Auch das "clear: both;" von jetzt sogar mehreren Elementen wurde komplett ignoriert.
Ansonsten sieht natürlich auch alles andere ganz fürchterlich aus...

<img src="http://sveni.dnsalias.net/forum/svwebsrv.anzeige-opera.png" border="0" alt="">

Opera-Darstellung. Zwar hat Opera "clear: both;" offensichtlich verstanden (Blitzmerker!), aber von Listenformatierung über CSS scheint auch dieser Browser noch nichts mitbekommen zu haben. Wie kommts?

<img src="http://sveni.dnsalias.net/forum/svwebsrv.anzeige-ie.png" border="0" alt="">

IE-Darstellung. Die totale Katastrophe. Es braucht gar nicht näher erläutert werden: Überhauptnicht nachvollziehbar ist die positionierung der bullets (die sollten ja gar nicht angezeigt werden.... argh!). Sieht alles etwas betrunken aus mit den lienen mal hier da, mal da hier und da nicht und hier nicht. M$ hat sich hier was ganz besonderes einfallen lassen: Beim hovern verschwinden ein paar linien, dafür erscheinen aber neue! Die bulletzeichen verschwinden dafür alle. Ein Wunder, dass die Linien nicht noch Schief sind.

So frage ich nun:

[ ] Ich bin zu blöd, ein bisschen CSS aufzusetzten
[ ] Mozilla ist zu blöd, mein CSS zu interpretieren
[ ] Opera auch
[ ] IE erst recht

Vielen Dank für rege wahlabgabe (aber bitte mehr als 50% Wahlbeteiligung!) - Kommentare erwünscht.

Der Wuffy | Wer sonst könnte sich mehr als 100 stunden mit so einem stumpfsinnn aufhalten, ohne verrückt zu werden?

  1. Hi,

    #seite .news-list li strong {
        font-size: 100%;
        font-weight: bold;
        display: block;
        float: left;
    }

    float erfordert zwingend die Angabe einer Breite.
    Abgesehen davon: im Beispiel-HTML kommt kein strong vor.

    #seite .news-list li em {
        font-style: italic;
        display: block;
        float: right;
    }

    float erfordert zwingend die Angabe einer Breite.

    cu,
    Andreas

    --
    MudGuard? Siehe http://www.Mud-Guard.de/
    Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
    1. Hallo,

      float erfordert zwingend die Angabe einer Breite.
      float erfordert zwingend die Angabe einer Breite.

      Es führt zu nichts, dass du und andere reflexartig reagieren, immer wenn irgendwo im Forum gleich in welchem Zusammenhang CSS-Regeln mit float ohne width auftauchen. Diese Hinweise, die meist keinerlei Rücksicht auf den Kontext nehmen, führen in der Regel keinen nennenswerten Schritt weiter in die Richtung einer Problemlösung. Es trifft in den seltensten Fällen das Kernproblem und zeigt meistens höchstens ein unwichtiges Randproblem. Es ist zwar angebracht, aufzuzeigen, dass diese Umsetzung fehlerhaft ist, aber diese Erkenntnis alleine führt nicht zu einer sinnvolleren und besseren Lösung. Ich nehme an, dass du dir den Sinn des Beispiels nicht einmal zu Gemüte geführt hast. In solchen Fällen wird float wie schon öfters besprochen mit der Absicht verwendet, dass die Spaltenbreiten flexibel sind. Die Angabe einer festen Breite führt hier zu gar nichts, weil sie das Konzept vereitelt. Das Einzige, worauf man also hinweisen könnte, ist, dass float hier komplett fehl am Platze ist, weil es eben in solchen Kontexten (flexible Spaltenbreite) laut Standard nicht eingesetzt werden kann. Das wiederum ist ebenfalls eine Erkenntnis, für die man sich nichts kaufen kann, weil sie einen zurückwirft anstatt weiterzubringen.

      Der Code wäre freilich hinsichtlich des Standards korrekt, wenn hier float und width eingesetzt werden würden. Das ist jedoch völlig irrelevant, weil das Konzept dahinter als Umsetzung gewisser Ansprüche letztlich noch defizitärer und unstimmiger wird, da die ursprünglich beabsichtigte Flexibilität verloren geht. Damit ist die Lösung als solche insgesamt problematisch. Es ist also im Sinne der Aufgabe unsinnig, hier width anzugeben und wenn float nur mit width möglich ist, dann ist eben jede Lösung, die float benutzt, unangemessen. Damit wäre man wieder beim besagten Dilemma.

      Es wäre zielführender, jeweils eine konkrete bessere Lösung vorzuschlagen, die den Anforderungen gerecht wird bzw. zumindest in sich stimmig ist. Daran mangelt es doch! Solche »float erfordert width«-Postings in ewig gleicher Form ohne jegliche sonstige Analyse hingegen halte ich für oberflächlich, weil sie sich nicht mit der Kernfrage beschäftigen und den Fragenden eher nur in Zweifel und Ungewissheit stürzen (weil diese width eben bewusst weggelassen hatten). Solche Postings braucht das Forum im Gegensatz zu wirklichen Auseinandersetzungen m.E. nicht. Zumal die aufgezeigten Codefehler oft für das konkrete Problem des Fragenden (warum zeigt Browser X dieses Verhalten und wie kann ich ihn dazu bringen, es richtig zu machen?) nicht relevant sind, weil der Fehler »float ohne width« nicht oder nicht hauptsächlich für das Browserverhalten verantwortlich ist. Wenn der Fragende den Code schon mitliefert, ist es nicht zuviel verlangt, dass die Antwortenden anhand dessen zum Kernproblem vorzustoßen versucht und dieses dann beschreibt, anstatt nur auf oberflächliche formale Fehler aufmerksam zu machen. Letzteres ist zwar auch angebracht, aber doch erfahrungsgemäß nebensächlich. Das heißt konkret, dass Wuffys Menü wahrscheinlich auch mit festen Breiten immer noch größtenteils kaputt angezeigt wird. Es hat also nicht wirklich weitergeholfen.

      Mathias

      1. hi,

        Es ist zwar angebracht, aufzuzeigen, dass diese Umsetzung fehlerhaft ist, aber diese Erkenntnis alleine führt nicht zu einer sinnvolleren und besseren Lösung.

        es ist der erste _fehler_, der ins auge fällt. nachdem der ausgebessert wurde, kann man ja ggf. das problem weiter diskutieren.

        Ich nehme an, dass du dir den Sinn des Beispiels nicht einmal zu Gemüte geführt hast. In solchen Fällen wird float wie schon öfters besprochen mit der Absicht verwendet, dass die Spaltenbreiten flexibel sind. Die Angabe einer festen Breite führt hier zu gar nichts, weil sie das Konzept vereitelt.

        warum steht davon _absolut gar nichts_ in der fragestellung?

        wenn da wenigstens stehen würde, wie es aussehen und was erreicht werden _soll_, dann kann man schneller beurteilen, ob das vom konzept her stimmig ist oder nicht.

        aber mein telefonjoker war leider schon verbraucht ...
        zum glück spielst du ja den publikumsjoker und interpretierst in die fragestellung des OP hinein, was dort eigentlich schon von anfang an reingehört hätte.

        gruß,
        wahsaga

        1. Hallo,

          Es ist zwar angebracht, aufzuzeigen, dass diese Umsetzung fehlerhaft ist, aber diese Erkenntnis alleine führt nicht zu einer sinnvolleren und besseren Lösung.

          es ist der erste _fehler_, der ins auge fällt. nachdem der ausgebessert wurde, kann man ja ggf. das problem weiter diskutieren.

          Ich habe doch gerade kritisiert, dass faktisch eben nicht weiter diskutiert wird (bzw. schon »weiter« in dem Sinne, dass diese Methode weiter durchgezogen wird, aber nicht »weiter« in dem Sinne, dass tiefer in die Materie eingestiegen wird). Es melden sich immer genug Leute zu Wort, wenn es um solche »ersten Fehler« geht. Die Spitze des Eisberges wird also zu Genüge kritisiert und entsprechend daran herumgedoktert. Darüber hinaus beteiligen sich aber zu wenige an tiefergehenden und umfassenderen Problemerörterungen, dadurch bleiben viele Threads auf dieser oberflächlichen Ebene stehen. Das liegt daran, dass es freilich bequem ist, mal eben ein eingeübtes Sprüchlein zu posten, anstatt sich intensiv in die Fragestellung einzuarbeiten und selbst nach einer annehmbaren Lösung als Gesamtkonzept zu suchen.

          Zudem habe ich mich dazu geäußert, dass es eben nicht zwangsläufig weiterhilft, die direkt ins Auge stechenden Fehler zu reparieren. Wenn die Umsetzung bereits grundlegend problematisch bzw. defizitär ist, dann ist sofort eine grundlegende Auseinandersetzung notwendig, nicht der Umweg über das Reparieren erster Fehler (das kann höchstens nebenher laufen, weil dieses Unverständnis des Fragenden selbstverständlich geklärt werden muss). Der Antwortende sollte also diese essentiellen Probleme ansprechen und erläutern, das ist wichtiger als alle Kleinigkeiten zusammen. Es können soviele oberflächliche Fehler kritisiert und anschließend repariert werden, wie man lustig ist, es führt wie gesagt nicht weiter. Ohne sinnvolles Konzept nützt syntaktisch korrekter Code nichts.

          Ich nehme an, dass du dir den Sinn des Beispiels nicht einmal zu Gemüte geführt hast. In solchen Fällen wird float wie schon öfters besprochen mit der Absicht verwendet, dass die Spaltenbreiten flexibel sind. Die Angabe einer festen Breite führt hier zu gar nichts, weil sie das Konzept vereitelt.

          warum steht davon _absolut gar nichts_ in der fragestellung?

          Es ist in der Fragestellung enthalten, weil mit aller Wahrscheinlichkeit nicht erwünscht ist, dass sich Layoutelemente überlagern oder Texte aus ihren Elementboxen fließen. Man soll width angeben, aber was für eine width denn bitte? Wie kann man hinreichend zuverlässig und genau in Erfahrung bringen, wie breit ein bestimmter Text bei der Darstellung ist, hier konkret etwa der des Datums? Wenn ein zu großer Wert angeben wird, wird die Fläche ineffizient ausgenutzt (was das kleinere Problem ist, was aber immer noch ärgerlich ist). Wenn der Inhalt zu breit für die angegebene Breite ist, tritt der Overflow auf. Man kann freilich dem Gesamtcontainer, hier der Liste, entsprechend eine feste px- oder em-Breite geben und dem entsprechend die Spaltenbreiten festzurren, wie es Wauwau hier gemacht hat. Diese Methode ist die des ungefähren Abschätzens, wie breit der Text minimal und maximal sein wird. Das ist das altbekannte »es funktioniert doch«, was hier im Forum ansonsten zurecht oft kritisiert wird, und diese Kritik wäre auch hier angebracht. Sicher, man kann mit Pi-mal-Daumen-Lösungen leben, aber zuverlässig ist das doch nicht, schon gar nicht in ähnlichen Fällen, wo sich nicht einfach für alle beteiligten Elemente feste Breiten vergeben lassen (ok, das war hier tatsächlich nicht die Frage).

          wenn da wenigstens stehen würde, wie es aussehen und was erreicht werden _soll_, dann kann man schneller beurteilen, ob das vom konzept her stimmig ist oder nicht.

          Wenn ich in solchen Fällen als Antwortender im Unklaren bin, antworte ich erst einmal mit einer Gegenfrage oder zunächst gar nicht und warte ab, sehe also keinen Grund, die ins Auge springenden formalen Fehler zu kritisieren, ohne gleichzeitig zu versuchen, zum Kern vorzustoßen.

          aber mein telefonjoker war leider schon verbraucht ...
          zum glück spielst du ja den publikumsjoker und interpretierst in die fragestellung des OP hinein, was dort eigentlich schon von anfang an reingehört hätte.

          Es ging mir ja nicht nur um diesen Einzelfall.

          Mathias

          1. Hallo molily, hallo wahsaga,

            Ich nehme mir jetzt frechweg einfach mal die Freiheit, mich in eure Diskussion einzuklinken - vielleicht auch, um evv. ein bisschen Klarheit in Bezug auf den konreten Fall, um den es hier zwar eigentlich nicht (mehr?) geht (das liebe ich doch an Grundsatzdiskussionen), zu liefern.

            Molily bemängelt, dass hier gewisse Personen nahezu 'stumpfsinnig ohne weiteres überlegen' eine Floskel von sich geben, die letztenendes evv. kaum etwas bringt. Diese Ansicht teile ich voll und ganz - mit betonung auf dem ... ganzen Satz ;)

            Dennoch ist auch fraglich, in wie fern ein Helfender noch weiter helfen könnte - ich habe nicht gesagt, was ich erreichen wollte, nein, aber ich denke, es ist ersichtlich. Immerhin ist es ja aus dem CSS, in Anbetracht der Bildchen sowie mit ein bisschen Vorstellungsvermögen gut vorstellbar, dass am Ende "rohboxen" mit schwarzem Rand, etwas margin und - inhalt dastehen sollen.

            Noch einmal kurz zum konkreten Fall, bevor ich in die (philosophischen) Abgründe der langen und so theoretischen Grundsatzdiskussion verfalle ;-): Dieses Posting http://forum.de.selfhtml.org/?t=82418&m=480209 bzw. dieses Bild: <img src="http://sveni.dnsalias.net/forum/svwebsrv.anzeige-endvergleich.png" border="0" alt=""> (selbstverständlich das Rendering von Mozilla ;) zeigt so in etwa, was ich eigentlich vorhatte - bzw. was ich mir erhoffte, was das CSS, was auf http://forum.de.selfhtml.org/?t=82418&m=480139 "abgedruckt" ist, machen sollte.

            Es ist zwar angebracht, aufzuzeigen, dass diese Umsetzung fehlerhaft ist, aber diese Erkenntnis alleine führt nicht zu einer sinnvolleren und besseren Lösung.

            jein. Ich meine, zwar hat mir der Hinweis auf die Tatsache, list-style-type würde nicht auf <ul>'s anzuwenden sein, mich auf die Idee gebracht, dass ich ja zur Listenformatierung der Seite bullets verwende und dementsprechend anders vorgehen muss (siehe http://forum.de.selfhtml.org/?t=82418&m=480209 und Antworten) - weitergebracht hat es mich trotzdem nicht richtig, stimmt schon (;-)

            [...] Darüber hinaus beteiligen sich aber zu wenige an tiefergehenden und umfassenderen Problemerörterungen, dadurch bleiben viele Threads auf dieser oberflächlichen Ebene stehen. Das liegt daran, dass es freilich bequem ist, mal eben ein eingeübtes Sprüchlein zu posten, anstatt sich intensiv in die Fragestellung einzuarbeiten und selbst nach einer annehmbaren Lösung als Gesamtkonzept zu suchen.

            Genau - man nehme das Beispiel
            <img src="http://sveni.dnsalias.net/forum/svwebsrv.anzeige-endvergleich.png" border="0" alt="">
            und versuche, den IE etwa das gleiche wie den Mozilla machen zu lassen ...

            Zudem habe ich mich dazu geäußert, dass es eben nicht zwangsläufig weiterhilft, die direkt ins Auge stechenden Fehler zu reparieren.

            Aber gegen dessen Erwähnung ist prinzipiell nichts einzuwenden. sollte diese natürlich nicht der eigentliche inhalt des postings sein ;) - siehe oben.

            [...] Ohne sinnvolles Konzept nützt syntaktisch korrekter Code nichts.

            Ich würde von dem Hilfesuchenden (in dem Fall ich) erwarten, dass er irgendeine "Sache" macht, also ein eigenes "Konzept hat", und lediglich bei Problemen das Forum aufsucht. Oder habe ich jetzt was falsch verstanden?

            Ich nehme an, dass du dir den Sinn des Beispiels nicht einmal zu Gemüte geführt hast. In solchen Fällen wird float wie schon öfters besprochen mit der Absicht verwendet, dass die Spaltenbreiten flexibel sind. Die Angabe einer festen Breite führt hier zu gar nichts, weil sie das Konzept vereitelt.

            (Dazu noch ganz kurz:) Genau deswegen habe ich auch 80% der 100% Breite für die "linke Spalte" und 20% für die rechte eingeteilt. Da das Datum sowieso immer DD.MM.YYYY ist, ist es an für sich immer gleich breit, und da das Design in diesem Falle sowieso eine pixelgenau vorgeschriebene schriftgröße vorschreibt, ließe sich die Breite der "rechten Spalte" auch einfach in Pixeln angeben.
            Darüberhinaus bin ich auf die glorreiche Idee gekommen, die "Überschrift" eines jeden Listenpunktes nicht zu floaten - ich weiß auch nicht, wie ich auf die Idee gekommen bin. Den unschön folgenden Effekt, siehe das nun mehrfach verlinkte Bild (mozilla-rendering), würde man damit auch beenden.

            warum steht davon _absolut gar nichts_ in der fragestellung?

            mitdenken? ;o)

            Es ist in der Fragestellung enthalten, weil mit aller Wahrscheinlichkeit nicht erwünscht ist, dass sich Layoutelemente überlagern oder Texte aus ihren Elementboxen fließen.

            Vorbildlich mitgedacht ;). Mehr dazu siehe oben.

            wenn da wenigstens stehen würde, wie es aussehen und was erreicht werden _soll_, dann kann man schneller beurteilen, ob das vom konzept her stimmig ist oder nicht.

            s.o.

            Wenn ich in solchen Fällen als Antwortender im Unklaren bin, antworte ich erst einmal mit einer Gegenfrage oder zunächst gar nicht und warte ab, sehe also keinen Grund, die ins Auge springenden formalen Fehler zu kritisieren, ohne gleichzeitig zu versuchen, zum Kern vorzustoßen.

            hmmm... ich würde erst einmal die schwerwiegenden CSS-Fehler anmerken [;-)] - und dann nachfragen.

            zum glück spielst du ja den publikumsjoker und interpretierst in die fragestellung des OP hinein, was dort eigentlich schon von anfang an reingehört hätte.

            Tja, irgendeiner muss ja mitdenken ;)

            Es ging mir ja nicht nur um diesen Einzelfall.

            Immer mitdenken ist noch besser ;-)

            Gruß,

            der Wuffy

            1. Hi,

              Dennoch ist auch fraglich, in wie fern ein Helfender noch weiter helfen könnte - ich habe nicht gesagt, was ich erreichen wollte, nein, aber ich denke, es ist ersichtlich. Immerhin ist es ja aus dem CSS, in Anbetracht der Bildchen

              Der Text

              Externes Bild

              trägt keinesfalls zur Klärung der Sachlage bei - auch wenn ich im Antwort-Feld sehe, daß dort ein - Überraschung - externes Bild eingebunden werden soll.

              Sehr aussagekräftig.
              Dazu war im Ausgangsposting HTML, das nicht zum CSS paßte (b statt strong).

              Und da erwartest Du, das ersichtlich ist, was Du erreichen willst?

              Wenn sich also der Hilfesuchende so wenig Mühe gibt (nicht zusammenpassender Code; Bilder, die nicht angezeigt werden), mach ich mir auch nicht die Mühe, mehr als die offensichtlichen Fehler zu nennen.

              Auch in diesem Posting steht z.B. wieder

              Genau - man nehme das Beispiel
              Externes Bild
              und versuche, den IE etwa das gleiche wie den Mozilla machen zu lassen.

              cu,
              Andreas

              --
              MudGuard? Siehe http://www.Mud-Guard.de/
              Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
              1. Hallo MudGuard,

                Externes Bild
                trägt keinesfalls zur Klärung der Sachlage bei - auch wenn ich im Antwort-Feld sehe, daß dort ein - Überraschung - externes Bild eingebunden werden soll.

                nun, ich mache mir die Mühe und bastele wunderbare Screenshots von drei unterschiedlichen Browsern zusammen, und du schaust sie dir nicht mal an? ;-)

                Aber mal ehrlich: Wenn man schon im Antwortfeld die Postings liest - dann sollte man - sofern interessiert - ja auch wegen dem Bild mal noch in das eigentliche Posting schauen und sich die aufwendig gestaltete Grafik anschauen. Oder man ist nicht interessiert, dann antwortet man jedoch in aller Regel auch nicht.

                Sehr aussagekräftig.

                An für sich mehr, als ein beschreibender Text: Zwar könnte ich in einem weiteren, langen Absatz beschreiben, wie wo was zu sehen ist, aber ich denke, dieses IE-Verhalten lässt sich nicht besser als durch einen Screenshot beschreiben. Und wie es aussehen sollte, auch nicht.

                Dazu war im Ausgangsposting HTML, das nicht zum CSS paßte (b statt strong).

                Das war da. Aber ich denke, mit ein bisschen "Querdenken" wäre dieses "Manko" umgehbar.

                Und da erwartest Du, das ersichtlich ist, was Du erreichen willst?

                nein. Ich glaube sogar, dass es ersichtlich wäre, würde ich gar keinen Text hinschreiben, sondern nur das Bild einbinden und drunter schreiben:

                "Jetzt zeigt Mozilla und Opera (rechts) alles richtig an. IE spinnt rum. was tun?"

                besser?

                Oder direkt vom Ursprungsproblem ausgehend: Jeden Text weglassen, drei bilder einbinden und drunterschreiben:

                "Eigentlich sollten hier Boxen, die sich nicht überschneiden, entstehen. was ist falsch? {css einbinden hier}"

                Wäre imho nur extrem unhöflich und dem Helfenden gegenüber eine Unverschämtheit. Viel besser ist es schon, wenn man eine etwas detailliertere Beschreibung abgibt. Und wie molily auch geschrieben hat, dass sich beispielsweise die Boxen nicht überschneiden sollen, das hätte man sich vielleicht denken können - oder?

                Wenn sich also der Hilfesuchende so wenig Mühe gibt (nicht zusammenpassender Code; Bilder, die nicht angezeigt werden), mach ich mir auch nicht die Mühe, mehr als die offensichtlichen Fehler zu nennen.

                Ach das Bild wurde gar nicht angezeigt? Hm - server nicht erreichbar? ja, das kann sein, denn ich habe nunmal keinen server sonstwo im Internet, der rundumdieuhr an ist.

                Obwohl ich mir mal ein bisschen "kostenlose Webspace" "holen" könnte, um genau solche Dinger abzuspeichern. Diese Idee ist gar nicht schlecht, das werde ich sogar mal machen.

                Auch in diesem Posting steht z.B. wieder
                Genau - man nehme das Beispiel
                Externes Bild
                und versuche, den IE etwa das gleiche wie den Mozilla machen zu lassen.

                ... und gleich wird der server auch wida runtergefahren 8(

                Gruß,

                der Wuffy

                PS: Warum runtegefahren? Ich habe eine jährliche Stromrechnung von mehreren Tausend Euro. Zwar nicht ich allein, sondern mein gesamter "Haushalt" um mich rum, aber es ist schon eine ganze Menge. Und da kann ich keine Computer einfach mal durchlaufen lassen.

                1. Hi,

                  Externes Bild
                  trägt keinesfalls zur Klärung der Sachlage bei - auch wenn ich im Antwort-Feld sehe, daß dort ein - Überraschung - externes Bild eingebunden werden soll.
                  nun, ich mache mir die Mühe und bastele wunderbare Screenshots von drei unterschiedlichen Browsern zusammen, und du schaust sie dir nicht mal an? ;-)

                  Wie denn - wenn nur Externes Bild da steht anstelle des Bildes?.

                  Aber mal ehrlich: Wenn man schon im Antwortfeld die Postings liest

                  Mach ich nicht - wie kommst Du darauf?

                  dann sollte man - sofern interessiert - ja auch wegen dem Bild mal noch in das eigentliche Posting schauen und sich die aufwendig gestaltete

                  Textstelle "Externes Bild" anschauen? Die ist nicht sehr aussagekräftig - da ist das [ image:... ] im Antwortfeld schon aussagekräftiger.

                  Oder man ist nicht interessiert, dann antwortet man jedoch in aller Regel auch nicht.

                  Was hilft es, wenn ich interessiert bin, wenn anstelle Deiner Bilder nur
                  Externes Bild
                  sichtbar ist?

                  nein. Ich glaube sogar, dass es ersichtlich wäre, würde ich gar keinen Text hinschreiben, sondern nur das Bild einbinden und drunter schreiben:

                  Wie gesagt, anstelle der Bilder erscheint bei Deinen Postings nur

                  Externes Bild

                  Oder direkt vom Ursprungsproblem ausgehend: Jeden Text weglassen, drei bilder einbinden und drunterschreiben:

                  Auch dreimal

                  Externes Bild

                  hilft nicht.

                  Ach das Bild wurde gar nicht angezeigt?

                  Ah, er hat's endlich gemerkt.

                  cu,
                  Andreas

                  --
                  MudGuard? Siehe http://www.Mud-Guard.de/
                  Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
                  1. Moin,

                    Externes Bild
                    [...]
                    Externes Bild
                    [...]
                    Externes Bild
                    [............]

                    Ach das Bild wurde gar nicht angezeigt?
                    Ah, er hat's endlich gemerkt.

                    jetzt mal ehrlich: Viel sinnloser kann man ein Posting ja gar nicht mehr aufsetzten.

                    Gruß,

                    Wauwau

  2. hi,

    <b>Überschrift</b>
               <em>Datum</em>

    <em> statt <i> gut, <b> statt <strong> bö ... nicht gut.

    #seite .news-list li strong {
        font-size: 100%;
        font-weight: bold;
        display: block;
        float: left;

    float ohne _explizite_ breitenangabe nicht korrekt.

    #seite .news-list li em {
        font-style: italic;
        display: block;
        float: right;

    float ohne _explizite_ breitenangabe nicht korrekt.

    [ ] Ich bin zu blöd, ein bisschen CSS aufzusetzten
    [ ] Mozilla ist zu blöd, mein CSS zu interpretieren
    [ ] Opera auch
    [X] IE erst recht

    gruß,
    wahsaga

    1. hi,

      <b>Überschrift</b>
                 <em>Datum</em>
      <em> statt <i> gut, <b> statt <strong> bö ... nicht gut.

      jep - und in anbetracht dieses ausschnitts CSS:

      #seite .news-list li strong {
          font-size: 100%;
          font-weight: bold;
          display: block;
          float: left;

      könnte man, wenn man gaaanz viel reininterpretiert, meinen, ich hätte mich verschrieben und statt <b>...</b> eigentlich <strong>...</strong> gemeint. Ist auch so. Aber das ändert an dem Gesamtergebnis nix ;)

      float ohne _explizite_ breitenangabe nicht korrekt.

      hmmm.... echt? tjaja - das ist  - überraschend. Wirklich, das wusste ich jetzt gar nicht.... hm - selfhtml sollte dringends überarbeitet werden.

      float ohne _explizite_ breitenangabe nicht korrekt.

      obwohl das auch nix dran ändert, dass beim ie rahmen verschwinden, bei allen browsern margin's verschlungen werden, usw.

      [X] IE erst recht

      sowas trifft doch immer wieder den Nagel auf dem Kopf ;-)

      Gruß,

      Wuffy

      1. Hallo,

        float ohne _explizite_ breitenangabe nicht korrekt.

        hmmm.... echt? tjaja - das ist  - überraschend. Wirklich, das wusste ich jetzt gar nicht.... hm - selfhtml sollte dringends überarbeitet werden.

        http://de.selfhtml.org/css/eigenschaften/positionierung.htm#float
        Da steht's!

        Gruß & guts Nächtle!
        Arx

        --
        ss:| zu:| ls:& fo:) de:] va:} ch:? n4:{ rl:? br:& js:| ie:% fl:| mo:}
  3. Hallo,

    #seite .news-list li {
        margin: 5px;
        padding: 0;
        list-style-type: none;
    }

    Da haben wir den Fehlerteufel, die list-style-type Zuweisung muss auf <ul> oder <ol> erfolgen, aber nicht auf <li>:
    http://de.selfhtml.org/css/eigenschaften/listen.htm#allgemeines
    http://www.w3.org/TR/CSS21/generate.html#lists

    <img src="http://sveni.dnsalias.net/forum/svwebsrv.anzeige-ie.png" border="0" alt="">

    IE-Darstellung. Die totale Katastrophe.

    Deshalb hab ich auch ie:{

    [ ] Ich bin zu blöd, ein bisschen CSS aufzusetzten

    glaub ich nicht

    [ ] Mozilla ist zu blöd, mein CSS zu interpretieren

    glaub ich auch nicht

    [ ] Opera auch

    kenn ich nicht so gut

    [ ] IE erst recht

    ie:{

    Wenn der Tipp nicht hilft, stell doch mal die Beispielseite online.

    Gruß
    Alexaner Brock

    --

    Selfcode: ss:{ zu:| ls:# fo:| de:] va:) ch:? sh:( n4:? rl:? br:> js:) ie:{ fl:| mo:}
    http://emmanuel.dammerer.at/selfcode.html
    Deshalb können Pinguine nicht fliegen:
    Was nicht fliegt kann auch nicht abstürzen
    <img src="http://www.againsttcpa.com/images/AgainstTCPA-Log01Small.gif" border="0" alt="">
    http://againsttcpa.com
    1. Hallo Alexander,

      #seite .news-list li {
          margin: 5px;
          padding: 0;
          list-style-type: none;
      }
      Da haben wir den Fehlerteufel, die list-style-type Zuweisung muss auf <ul> oder <ol> erfolgen, aber nicht auf <li>:
      http://de.selfhtml.org/css/eigenschaften/listen.htm#allgemeines
      http://www.w3.org/TR/CSS21/generate.html#lists

      hm... gut, das mag ja sein, aber ich hab's auch schon mit Zuweisung des entsprechenden Styles dem <ul> ausprobiert, das ergebnis war das gleiche. Ich werd's aber nochmal ausprobieren.

      [image]
      IE-Darstellung. Die totale Katastrophe.
      Deshalb hab ich auch ie:{

      Na gut, das hilft mir aber auch nicht weiter.

      [ ] Ich bin zu blöd, ein bisschen CSS aufzusetzten
      glaub ich nicht

      wer weiß ;)

      [ ] Mozilla ist zu blöd, mein CSS zu interpretieren
      glaub ich auch nicht
      [ ] Opera auch
      kenn ich nicht so gut

      ich würde die CSS-Interpretationskunst vom Opera exellent beurteilen. Seit Opera7 bietet dieser Browser schon eine ganze Menge. Großes Manko: Shareware.

      [ ] IE erst recht
      ie:{

      [...]

      Wenn der Tipp nicht hilft, stell doch mal die Beispielseite online.

      Ja, das ließe sich zwar reintheoretisch machen, aber die unzähligen Bilder und CSSe usw. - das ist ne ganze menge arbeit, die seite 1:1 "online zugänglich" zu speichern 8|

      Aber das mit dem style-dingsteil werde ich ausprobieren :)

      Gruß,

      der Wuffy

      1. Hi,

        Da haben wir den Fehlerteufel, die list-style-type Zuweisung muss auf <ul> oder <ol> erfolgen, aber nicht auf <li>:

        Nein. list-style-type ist für Elemente mit display-Eigenschaft list-item definiert.
        Für ul trifft das im Gegensatz zu li aber nicht zu.0

        http://www.w3.org/TR/CSS21/generate.html#lists

        Ist auch hier nachzulesen, unter "Applies to".

        cu,
        Andreas

        --
        MudGuard? Siehe http://www.Mud-Guard.de/
        Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
        1. Hallo,

          Hi,

          Da haben wir den Fehlerteufel, die list-style-type Zuweisung muss auf <ul> oder <ol> erfolgen, aber nicht auf <li>:

          Nein. list-style-type ist für Elemente mit display-Eigenschaft list-item definiert.
          Für ul trifft das im Gegensatz zu li aber nicht zu.0

          Warum wird dann list-style-type sowohl in der Spezifikation als auch in SelfHTML immer nur auf <ul> oder <ol> angewandt?

          Gruß
          Alexaner Brock

          --

          Selfcode: ss:{ zu:| ls:# fo:| de:] va:) ch:? sh:( n4:? rl:? br:> js:) ie:{ fl:| mo:}
          http://emmanuel.dammerer.at/selfcode.html
          Deshalb können Pinguine nicht fliegen:
          Was nicht fliegt kann auch nicht abstürzen
          <img src="http://www.againsttcpa.com/images/AgainstTCPA-Log01Small.gif" border="0" alt="">
          http://againsttcpa.com
          1. Holadiha,

            Da haben wir den Fehlerteufel, die list-style-type Zuweisung muss auf <ul> oder <ol> erfolgen, aber nicht auf <li>:
            Nein. list-style-type ist für Elemente mit display-Eigenschaft list-item definiert.
            Für ul trifft das im Gegensatz zu li aber nicht zu.0
            Warum wird dann list-style-type sowohl in der Spezifikation als auch in SelfHTML immer nur auf <ul> oder <ol> angewandt?

            hm.... in SelfHTML sind eine menge sachen "falsch" bzw. "fälschlich" [;-)] - obwohl hier ja nicht direkt ein fehler vorliegt (denk ich mal - ich hab jetzt nicht nachgeschlagen wo in der selfhtml was steht). aber probier doch einfach mal

            <ul style="list-style-type: none;">
               <li>Probieren geht über Studieren</li>
               <li style="list-style-type: disc;">Liebe geht über Triebe</li>
               <li style="list-style-type: circle;">Tante fällt über Kante</li>
               <li style="list-style-type: square;">Schauschau, Wauwau</li>
            </ul>

            "Liste wichtiger Reime", (c) by Stefan Münz (oder?), kompletiert von mir (several usernames found).

            Wuffy

            PS: ich habe das posting jetzt einfach mal fies ausgenutzt (weil ich bei dem da: http://forum.de.selfhtml.org/?t=82418&m=480209 vergessen habe, den titel zu ändern) um zu signalisieren, dass das Problem zum größten Teil behoben ist, siehe http://forum.de.selfhtml.org/?t=82418&m=480209.

          2. Hi,

            Nein. list-style-type ist für Elemente mit display-Eigenschaft list-item definiert.
            Für ul trifft das im Gegensatz zu li aber nicht zu.0

            Warum wird dann list-style-type sowohl in der Spezifikation als auch in SelfHTML immer nur auf <ul> oder <ol> angewandt?

            Weil es in CSS Vererbung gibt.

            cu,
            Andreas

            --
            MudGuard? Siehe http://www.Mud-Guard.de/
            Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
        2. Hola,

          Da haben wir den Fehlerteufel, die list-style-type Zuweisung muss auf <ul> oder <ol> erfolgen, aber nicht auf <li>:
          Nein. list-style-type ist für Elemente mit display-Eigenschaft list-item definiert.
          Für ul trifft das im Gegensatz zu li aber nicht zu.0
          http://www.w3.org/TR/CSS21/generate.html#lists
          Ist auch hier nachzulesen, unter "Applies to".

          und ich habe mich schon gewundert! denn an einigen stellen habe ich list-style-xxx-zuweisungen von <li>-punktelchen schon gesehen...

          na gut, ich habe jetzt mal folgendes modifiziert:

          #seite .news-list ul {
              margin: 0;
              padding: 0;
              list-style-type: none;
              list-style-image: url(/images/blank.gif);
          }

          #seite .news-list li {
              margin: 5px;
              padding: 0;
          }

          #seite .news-list li a {
              display: block;
              padding: 4px;
              border: 1px solid black;
              clear: both;
              text-decoration: none;
          }

          #seite .news-list li a:link, #seite .news-list li a:visited {
          }

          #seite .news-list li a:hover {
          }

          #seite .news-list li a:active, #seite .news-list li a:focus {

          }

          #seite .news-list li strong {
              font-size: 100%;
              font-weight: bold;
              display: block;
              float: left;
              width: 80%;
          }

          #seite .news-list li em {
              font-style: italic;
              display: block;
              float: right;
              width: 20%;
              text-align: right;
          }

          #seite .news-list li span {
              clear: both;
          }

          jetzt sieht soweit alles so aus wie es soll: die bullets sind weg (der trick war nämlich, dass ich grafikbullets für die ganze seite genutzt habe, und die bekomme ich selbstverständlich nur mit list-style-image: url(transparentes gif); weg - oder gibt's nen besseren weg? nicht laut selfhtml), die margins da. float's haben breitenangaben, wunderbar.

          Opera sowie Mozilla zeigen es also richtig an, den IE können wir natürlich vergessen - katastrofal [<-- ;-)]. Zwar macht er das mit den margins und sowas alles ordentlich richtig, aber er hat diesbezüglich ja seinen komischen irgendwas-bug, sodass er mal elemente ausblendet, usw..

          ist sehr traurig, denn ich würde IE-benutzer ungerne ausschließen. Aber mein Design ist einfach soooo - wunderbar nur-mit-css gemacht, wieso sollte ich alles zerstören und auf alte tabellen zurückgehen, nur um nicht 80% der Seitenbesucher (Laut letzter webalizer-statistik sind es etwa 60%) von der lesbarkeit der wbseite auszustoßen? ;-)

          ach man, der IE ruiniert einem mal wieder alles:

          <img src="http://sveni.dnsalias.net/forum/svwebsrv.anzeige-endvergleich.png" border="0" alt="">

          IE-Rendering links, Mozillas perfektes rechts (Operas sieht genauso aus). Beim überfahren dieser einzelnen großen Links legt der IE höchstseltsame Verhaltensweisen an den Tag: Ganze Teile werden ein- und ausgeblendet, linien erscheinen und linien verschwinden, unterstreichungen erscheinen und verschwinden - dieser gottverdammte ******-browser! *sehrverärgert*

          So, eine gute n8 wünsch ich euch,
          danke Alexander, Wahsaga und natürlich MudGuard für die Hilfe,

          der Wuffy

          PS: hm - ja, der server, der die schönen bildchen (s.o.) hostet, wird gleich runtergefahren - dann kann man sie nicht mehr sehn. tjaja...

          1. Hi,

            list-style-image: url(/images/blank.gif);

            list-style-image:none

            jetzt sieht soweit alles so aus wie es soll: die bullets sind weg (der trick war nämlich, dass ich grafikbullets für die ganze seite genutzt habe, und die bekomme ich selbstverständlich nur mit list-style-image: url(transparentes gif); weg - oder gibt's nen besseren weg?

            Natürlich gibt es den, siehe oben.

            cu,
            Andreas

            --
            MudGuard? Siehe http://www.Mud-Guard.de/
            Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
            1. Hi,

              list-style-image: url(/images/blank.gif);
              list-style-image:none

              irgendwie fallen mir bei der Selfhtml immer mehr dinge auf, die

              a) nicht stimmen
               b) fehlinterpretiert werden können
               c) nicht mehr stimmen
               d) gar nicht erwähnt sind

              hmmm.... - aber es gehen ja Gerüchte um eine Art Version9 rum... :)

              Wuffy