Patrick S: Unsauberes <table>

Abend,

bisher habe ich ein kleines Anzeigeproblem bei meiner Website durch mehrere  s behoben. Nur leider hat das nur bei IE wirklich geholfen, in den anderen Browsern sind die Tabellen hässlich verschoben, nicht mehr mittig. Also versuche ich nun, das Ganze ohne Schummeleien (und nebenbei ohne css) herzustellen.

Im Folgenden Link habe ich die  s entfernt, css rausgehauen und zur besseren Ansicht ein border="1" hingesetzt.

Ziel/Problem:
http://extreme-hecking.net/index.php?inhalt=tidy-sessions

Original mit  , bei Moz/NC/Opera auch schön das Problem zu sehen:
http://extreme-hecking.net/index.php?inhalt=sessions

Das Problem:

Woraus resultiert diese riesige Lücke im <td> des Vorschau-Bildes ("tidy"-Link)? Keine  s, keine Absätze im HTML Code, keine width-Angabe...

Ideen?

Gruss
Patrick S

  1. Hallo,

    Eine Antwort gibt Dir immer der Validator:
    http://validator.w3.org/check?uri=http%3A%2F%2Fextreme-hecking.net%2Findex.php%3Finhalt%3Dtidy-sessions

    CSS ist das beste was Deiner Webpräesenz passieren kann. Alles was in Deiner Webpräsenz visuell beeinflusst werden soll, machst Du mit CSS. Nur die eigentliche, im Prinzip völlig unformatierte Struktur machst Du mit html. border ist also veraltet. Nimm CSS.

    Heiner

    1. W3 streikt. Wie immer. Gut so, ich gehe nie nach den Standards, tut mir leid.. ^^

      Die borders habe ich auch nur in die Testdatei integriert, damit man sieht, dass das Vorschau-<td> das Problem ist. Mit "CSS entfernen" meinte ich nur die style=background, weiterhin benutze ich css als Grundlayout.

      Da W3 nun (Gott sei Dank) schweigt - woher kommt die Monsterlücke?

      1. Hallo,

        ich gehe nie nach den Standards, tut mir leid.

        Wieso das denn? Damit stellst Du sicher, dass ein Großteil der Browser Deinen Quelltext wenigstens halbwegs so anzeigt, wie Du es möchtest.

        Da W3 nun (Gott sei Dank) schweigt - woher kommt die Monsterlücke?

        Schau Dir doch wenigstens mal an, was der Validator sagt. (Bei mir streikt er übrigens nicht, übrigens noch nie!). Wenn Du alle Fehler beseitigt hast, dann erst hast Du html und darum geht es ja hier. Da wirst Du dann merken, dass einige html-Elemente an Stellen sind, wo sie nicht hingehören, dass Attribute fehlen etc. Aber wenn Du nicht nach Standards gehen willst? Bleibt ja Deine Entscheidung.

        Heiner

        1. Mag es eine falsche Einstellung sein, aber ich fühle mich durch W3 eingeschränkt, mir wird da ein Stück Programmier-Freiheit genommen, daher richte ich mich nicht danach. Aber da heute die Browser-Parser immer schlampiger werden, sind die Resultate bisher nie anders. Ich vergleiche alle meine Seiten mit "OpTool" in allen Browsern.

          Zum Problem:

          Der Validator meldet mir "I was not able to extract a character encoding labeling from any of the valid sources for such information. [etc.]".

          Mal abgesehen vom Validator: Was verursacht letztendlich die Lücke, was ist falsch plaziert?

          1. Der Validator meldet mir "I was not able to extract a character encoding labeling from any of the valid sources for such information. [etc.]".

            Du hast ja auch nix dergleichen angegeben. Du kannst die Zeichenkodierung und die gewünschte html-Version aber auch manuell im Validator einstellen, wenn Du unbedingt auf Doctype und Kodierung in deinem Quellkode verzichten willst (warum auch immer). Einfach die beiden Felder auswählen.

            Da html keine Programmiersprache ist, brauchst Du auch keine Programmierfreiheit.

            Heiner

            1. Oioioioi, der zeigt ja sogar <div align="center"> als Fehler an...

              Nun, ich kann aus dem Gewimmel leider nicht meinen Fehler rausfinden. Was genau muss ich zwischen <table> und </table> ändern, damit die Lücke weggeht? Der Rest der Seite soll vorerst egal sein, alle Browser zeigen es schließlich richtig an.

              @Programmierfreiheit: Gut, nennen wir es Layoutfreiheit ;)

              1. Hallo Patrick,

                Oioioioi, der zeigt ja sogar <div align="center"> als Fehler an...

                na, warum wohl? weil"align" deprecated ist.

                Nun, ich kann aus dem Gewimmel leider nicht meinen Fehler rausfinden. Was genau muss ich zwischen <table> und </table> ändern, damit die Lücke weggeht? Der Rest der Seite soll vorerst egal sein, alle Browser zeigen es schließlich richtig an.

                @Programmierfreiheit: Gut, nennen wir es Layoutfreiheit ;)

                Das ist eine ganz blöde Einstellung. Wenn dein Code valide ist, kommt es erst in 99,9% aller Fälle gar nicht zu so einer Fehldarstellung. Heiner hat sich nun mehrmals bemüht, dir zu erklären, wo der Sinn einer Validitätsprüfung liegt, aber du scheinst äusserst lernresistent.

                Gruß

                Kurt

                --
                "Mut ist eine Tugend, doch Angst beweist Vernunft, Bewusstsein und Phantasie. Die Kunst ist es abzuwägen."
                http://faq.united-web.at
                http://elektro-dunzinger.at
                http://shop.elektro-dunzinger.at
                1. Öh.. ja...

                  dass mein Code metaphorisch eine Vergewaltigung des W3 ist, war mir von Anfang an klar. Das einzige, was ich gerne wüsste, ist die genaue Codeänderung dieses <table>s, damit sich die Lücke schließt.

                  Lernresistenz (auch mal eine nette Umschreibung) lasse ich mir auch gerne zuschreiben, das W3 wird von Tag zu Tag schlimmer. Jetzt erfahre ich sogar, dass das align (unter den Top 5 in meiner Codeverwendung) depraced ist.

                  Seit Post X ist das gekommen, was ich befürchtet habe beim Schreiben. Ich äußerte nebenbei meine Haltung zum W3. Als ob ein Türke sich in einer Naziversammlung geäußert hat (und nein, damit meine ich nicht die Mentalität, Intoleranz der Nazis selber, ich meine die tödliche Situation, nicht falsch verstehen).

                  Meine Bitte: Lasst mich in Sachen W3 einfach mal dumm agieren, alles, worum ich euch bitte, ist eine kleine Quelltextänderung, die zwischen <table> und </table> liegt.
                  Ja, ich bin stur, ja, diese Einstellung ist falsch und einem Webdesigner unwürdig, ja, dies ist nicht der richtige Weg, etc. Ich wäre euch einfach nur unendlich dankbar für die Beantwortung der Frage, die ich in diesem Absatz noch einmal genau formuliert habe.

                  Danke und Gruss
                  Patrick S.

                  1. Hallo,

                    Meine Bitte: Lasst mich in Sachen W3 einfach mal dumm agieren, alles, worum ich euch bitte, ist eine kleine Quelltextänderung, die zwischen <table> und </table> liegt.

                    Deine Änderungen musst du schon selbst durchfüphren, Tips dazu hast du ja massig bekommen.

                    Ja, ich bin stur, ja, diese Einstellung ist falsch und einem Webdesigner unwürdig,

                    WAS??? Du bist Webdesigner??? Und hast eine derartige Einstellung???

                    ja, dies ist nicht der richtige Weg, etc. Ich wäre euch einfach nur unendlich dankbar für die Beantwortung der Frage, die ich in diesem Absatz noch einmal genau formuliert habe.

                    Du bist nicht nur Stur, du kannst auch nicht zuhören. Ändere deinen Code so, daß er valide ist und dein Problem wird mit ziemlicher Sicherheit behoben sein. Ich bin mit Sicherheit nicht dazu da, mich durch dein Gewusel zu wühlen und Fehler, die eine Fehlanzeige verursachen,  von Fehlern, die keine odser kaum Auswirkungen haben, auseinanderzuklamüsern. Mit deiner einstellung und deinen Widewrstand gegen gute Ratschläge wird dir nur das Motte dieses Forums bleiben, nämlich "SELF".
                    Versteh mich nicht falsch, ich bin gerne bereit, zu helfen, soweit es meinen Möglichkeien entspricht, aber ich bin nicht dazu da, mich statt dir durch deinen Schrotthaufen zu wühlen, und zu suchen, was denn nun die Ursache ist, daß alles auseinanderfliegt. Soweit geht meine Hilfsbereitschaft nun bei weitem nicht und ich bezweifle, ob du hier so jemanden findest.

                    Gruß

                    Kurt

                    --
                    "Mut ist eine Tugend, doch Angst beweist Vernunft, Bewusstsein und Phantasie. Die Kunst ist es abzuwägen."
                    http://faq.united-web.at
                    http://elektro-dunzinger.at
                    http://shop.elektro-dunzinger.at
                    1. Ich vermute/behaupte/erdreiste mich, zu behaupten, dass der Fehler nicht im ganzen Schrotthaufen, sondern nur im Teil des Schrotthaufens, der zwischen <table> und </table> liegt, ist. Ich dachte eigentlich, dass das keine dreiste Aufforderung ist, da diese Codeteil doch relativ klein ausfällt.

                      Man hätte den Thread auch nennen können "Wettbewerb: Verbessere den <table>-Teil, ohne an die W3-Angaben zu denken".

                      Hm.. probiere ich einfach noch einmal lustig herum. ^^"

                      Danke
                      Patrick

                      1. Moin!

                        Ich vermute/behaupte/erdreiste mich, zu behaupten, dass der Fehler nicht im ganzen Schrotthaufen, sondern nur im Teil des Schrotthaufens, der zwischen <table> und </table> liegt, ist. Ich dachte eigentlich, dass das keine dreiste Aufforderung ist, da diese Codeteil doch relativ klein ausfällt.

                        Das festzustellen gelingt nur bei validem Code.

                        Es ist nun mal eine der ungeschriebenen Richtlinien in diesem Forum, dass die Fehlersuche in HTML-Seiten nur gelingt, wenn die Seite valide ist. Nur dann können Fehlinterpretationen der Browser wirklich ausgeschlossen werden - und in 99% der Fälle sind die Probleme eben auf Fehlinterpretationen zurückzuführen, die die Fehlerkorrektur der Browser eingebaut hat.

                        Deshalb: Wenn du willst, dass man dir hilft, dann sorge für eine valide Seite. Deine hat jedenfalls noch erhebliche Verschachtelungsprobleme - und das ist nach meiner Erfahrung meist tödlich für die Darstellungssicherheit.

                        Man hätte den Thread auch nennen können "Wettbewerb: Verbessere den <table>-Teil, ohne an die W3-Angaben zu denken".

                        Dann bist du im falschen Forum. Hier wird ständig an die W3-Angaben gedacht, weil nur die W3-Angaben relevant sind für die Darstellung im Browser.

                        Es ist ganz einfach so, dass niemand alle möglichen Fehlerkorrekturcodes aller Browser kennen kann, um abzuschätzen, ob die Validator-Fehlermeldungen deiner Seite mit dem Problem zu tun haben, oder nicht. Aber bei einer validen Seite kann diese Fehlerquelle ausgeschlossen werden.

                        Die Seite valide zu machen ist aber deine Aufgabe. Wenn du das nicht leisten willst, löst das dein Problem nicht - wir werden das dann aber auch nicht tun.

                        Fragen zu Fehlermeldungen des Validators (die zugegeben nicht immer auf den ersten Blick verständlich sind) werden aber gern beantwortet.

                        - Sven Rautenberg

                        --
                        ss:) zu:) ls:[ fo:} de:] va:) ch:] sh:) n4:# rl:| br:< js:| ie:( fl:( mo:|
                        1. Hm.. ich habe einmal dieses transistional eingebaut. Danach ist mein Stylesheet nicht mehr eingebunden worden (<link rel= .. im Head) und die Seite sah aus wie nach einem Erdbeben.. gibt es irgendwo eine komplette Liste der Vorraussetzungen fürs validate? Im Validator selber werden nur 'foo'-Beispiele in Syntaxcode erklärt. Ich bräuchte also eine Liste der Verbote, erlaubten Codes und Alternativen (z.B. für <div align="center">).

                          1. Hallo Patrick,

                            z.B. für <div align="center"> <div style="text-align:center;margin-left:auto;margin-right:auto;">
                            Grundsätzlich sollten die marginangaben genügen, jedoch interpretiert dies der IE nicht, deshalb musst du auch text-align dazu angeben.
                            Ein hervorragendes Nachschlagewerk zu CSS und HTML findest du hier: http://selfhtml.teamone.de/css/index.htm http://selfhtml.teamone.de/html/index.htm
                            Grundsätzlich kannst du vorerst mal davon ausgehen, daß die meisten Attribute, die der Formatierung dienen, deprecated (auf der Abschußliste) sind und durch CSS ersetzt wurden. In HTML 4.01 transitional ist noch so manches zulässig, was in HTML 4.01 strict nicht mehr verwendet werden darf.
                            Solltest du mal keine CSS-Entsprechung finden, oder aber auf Probleme bei deren Verwendung stoßen, sind wir hier gerne bereit, dir bei der Umsetzung behilflich zu sein.
                            Keine Angst, es ist bei weitem nicht so schwer, wie es auf den ersten Augenblick erscheint.

                            Gruß

                            Kurt

                            --
                            "Mut ist eine Tugend, doch Angst beweist Vernunft, Bewusstsein und Phantasie. Die Kunst ist es abzuwägen."
                            http://faq.united-web.at
                            http://elektro-dunzinger.at
                            http://shop.elektro-dunzinger.at
                            1. Abend,

                              HTML und CSS beherrsche ich natürlich bereits (auch durch diese Links, nebenbei), gibt es eine Liste, die validate HTML aufzählt? So dass ich nicht raten muss, ob ein Tag depraced ist oder nicht?
                              Der Validator gibt zurück, _dass_ etwas falsch ist, nur das direkte _warum_ und _was_, das fehlt.

                              Gruss
                              Patrick

                              1. Der Validator gibt zurück, _dass_ etwas falsch ist, nur das direkte _warum_ und _was_, das fehlt.

                                Die Faustregel wurde Dir bereits mehrfach beschrieben: Layout wird mit CSS gemacht, Textauszeichnung mit html. Du kannst in Selfhtml nachschauen, welchem Standard ein Element oder ein Attribut entspricht. Insbesondere aber auch beim W3C. Dort sind für alle Elemente zulässige Attribute aufgelistet.

                                Heiner

                            2. PS:

                              Hat sich, so etwas habe ich gesucht: http://edition-w3.de/TR/1999/REC-html401-19991224/

                              Gruss
                              Patrick

                  2. Jetzt erfahre ich sogar, dass das align (unter den Top 5 in meiner Codeverwendung) depraced ist.

                    Sinn dabei ist, dass das eigentlich HTML nur zur Struckturierung der Webseite dienen soll, das Layout wird über CSS gesteuert.

                    Meine Bitte: Lasst mich in Sachen W3 einfach mal dumm agieren, alles, worum ich euch bitte, ist eine kleine Quelltextänderung, die zwischen <table> und </table> liegt.

                    Stell dir mal vor, wenn eine große dt. Elektrofirma auf einmal keine Schukostecker an ihre Geräte schrauben würde mit der Begründung, diese Stecker passen nicht in unser Konzept.
                    Baust du dann auch all deine Steckdosen um, nur dass du deren Elektrogeräte verwenden kannst?
                    Hier ist es unvorstellbar, im Inet werden Standards einfach aufgeweicht von den Herstellern.
                    Ich frage mich ehrlich, warum hier noch kein großer Schrei gekommen ist. Nein, da werden dann auch diese Abweichungen auch noch voll ausgekostet, weil die Hersteller es 'möglich' machen.

                  3. hi,

                    das W3 wird von Tag zu Tag schlimmer. Jetzt erfahre ich sogar, dass das align (unter den Top 5 in meiner Codeverwendung) depraced ist.

                    das dient dazu, den inhalt weitgehend vom layout zu trennen.

                    Seit Post X ist das gekommen, was ich befürchtet habe beim Schreiben. Ich äußerte nebenbei meine Haltung zum W3.

                    deine "haltung" zum W3 ist hier aber uninteressant.
                    wir beschäftigen uns hier mit dem erstellen von (X)HTML-webseiten, und nicht mit "lieber browser rate mal, was ich mit diesem verpfuschten code gemeint haben könnte"-webseiten

                    Meine Bitte: Lasst mich in Sachen W3 einfach mal dumm agieren, alles, worum ich euch bitte, ist eine kleine Quelltextänderung, die zwischen <table> und </table> liegt.

                    die meisten hier halten es für zwecklos, sich auf die suche nach darstellungsfehlern zu begeben (besonders dann, wenn sie die "besseren" browser mozilla und opera betreffen), bevor nicht erst einmal valider html- und css-code vorliegt, und das zu recht.

                    gruss,
                    wahsaga

                  4. Hallo!

                    Als ob ein Türke sich in einer Naziversammlung geäußert hat (und nein, damit meine ich nicht die Mentalität, Intoleranz der Nazis selber, ich meine die tödliche Situation, nicht falsch verstehen).

                    emu's law: Godwin's Law wird durch Variation und Entschuldigung nicht beeinflusst.

                    emu

                    1. Hallo emu,

                      emu's law: Godwin's Law wird durch Variation und Entschuldigung nicht beeinflusst.

                      Verfalle bitte nicht dieser dämlichen Versuchung "laws" zu erfinden, das war schon vor entlichen Jahren in den NGs nicht wirlich lustig.

                      Grüße
                      Thomas

    2. Hallo!

      das beste
      Webpräsenz
      visuell beeinflusst

      Bingo!

      emu

      1. Nabend,

        Was wolltest Du der Nachwelt mit diesem Beitrag hinterlassen?

        Jan

        1. Moin!

          Was wolltest Du der Nachwelt mit diesem Beitrag hinterlassen?

          Buzzword-Bingo!

          Allerdings wären dazu mindestens vier Begriffe zu nennen gewesen - vgl. Bingo-Regeln.

          - Sven Rautenberg

          --
          ss:) zu:) ls:[ fo:} de:] va:) ch:] sh:) n4:# rl:| br:< js:| ie:( fl:( mo:|
        2. Hallo!

          das beste
          Webpräsenz
          visuell beeinflusst
          Bingo!
          Was wolltest Du der Nachwelt mit diesem Beitrag hinterlassen?

          <img src="http://www.monkeyboys.org/images/dilbert-buzzword.jpeg" border="0" alt="">

          emu

  2. Hallo,

    in den anderen Browsern sind die Tabellen hässlich verschoben, nicht mehr mittig.

    Warum nimmst du nicht <table align="center"> ?

    Grüße
    Thomas

  3. Hallo Patrick,

    bisher habe ich ein kleines Anzeigeproblem bei meiner Website durch mehrere  s behoben. Nur leider hat das nur bei IE wirklich geholfen, in den anderen Browsern sind die Tabellen hässlich verschoben, nicht mehr mittig. Also versuche ich nun, das Ganze ohne Schummeleien (und nebenbei ohne css) herzustellen.

    Woraus resultiert diese riesige Lücke im <td> des Vorschau-Bildes ("tidy"-Link)? Keine  s, keine Absätze im HTML Code, keine width-Angabe...

    Ideen?

    Nachdem du genug über Validität gehört hast, jetzt zur Ursache deines Problems.

    In deinem Beispiel fehlen sämtliche Angaben zur Größe. Weder Bilder  noch Tabellen verfügen über irgendwelche Angaben. Du überläßt damit dem Browser zu entscheiden, wie er sich verhält. Nunja, diese entscheiden eben unterschiedlich:

    IE: macht die erste Zelle so groß wie der Inhalt und die zweite Zelle enthält den Rest.

    Opera, Mozilla: geben jeder Zelle die Größe 50%, der tatsächlichen Tabellenweite.

    Kein Browser macht hier etwas falsch, sondern jeder nutzt den Entscheidungsspielraum, den du ihnen läßt. Hier rächt sich deine Faulheit auf jede Größenangabe zu verzichten.

    Im Beispiel hat es schon gereicht, der Problemzelle eine Weite zu verpassen.

    Ich tippe darauf, dass deine Bilder oft unterschiedlich groß sind. Da du PHP zur Verfügung hast, möchte ich dich auf die Funktion getimagesize
    http://www.php.net/manual/de/function.getimagesize.php aufmerksam machen. Mit ihr kannst du die Bildgröße ermitteln und die entsprechenden Größen in der Tabelle setzen.

    Übrigens solltest du alle Grafiken mit Größenangaben versehen. Damit verschwindet das unangenehme Hüpfen beim Laden der Seite, da der Browser dann weiß, wie viel Platz er dem Bild einräumen muss.

    Viele Grüße

    Antje