Problem bei Tabellenformatierung mittels einer Klasse

[Patrick86]

Ich habe also in dem <foot>-Teil meiner Tabelle eine Überschrift in einem <span>-Element und den Textteil in gar keinem Element.

Falsch. Der Text steht immer noch im td-Element.

Natürlich! *gegen die Stirn hau* Das hatte ich jetzt im Eifer des Posting-Gefechtes ganz übersehen.

Nun sieht das eigentlich schon genau so aus, wie ich es haben will, aber das alles, also die Art und Weise, wie ich zum Ziel gekommen bin, fühlt sich für mich extrem unsauber an: Zur Formatierung meiner Überschrift in <tfoot> ein formatiertes Element <span> zu benutzen ist doch nicht im Sinne des Erfinders, oder?

Stimmt, wenn man sehr konsequent ist.

Und das mein Textteil einfach so "da rum steht", gefällt mir auch nicht. Oder übertreibe ich da und sollte einfach mit der gewünschten Optik, die ich ja habe, zufrieden sein?

Du solltest dich beim Schreiben des Markup (HTML) eher an der logischen Struktur orientieren: Ergibt ein zusätzliches Containerelement für den Text hier einen strukturellen Sinn? IMO schon. Es fasst den Text und die darin enthaltenen Links zu einer Gruppe zusammen.

Meine Überlegungen bei der Sache waren hauptsächlich ordnungs- oder übersichtlichkeitsbezogen. Da in meinem <td>Element das eine Element, die Überschrift, ein extra Element war (also im einen Beispiel <span> und im anderen dann <h6>), wollte ich den Text- bzw. Listenteil nicht "lose rumstehen" lassen - das erschien mir... unordentlich.^^ Deshalb wollte ich diesen zweiten Teil auch als eigenständiges Unterelement von <td> haben.

Ich denke das ist eigentlich das, was du meinst mit der logischen Struktur, die den Textteil zu einer Gruppe zusammenfasst, oder? Ich konnte es nur nicht so schön formulieren :)

Ich würde jedenfalls viel lieber ein <h>-Element nutzen, um die Überschrift zu formatieren und dann <span> eben für den Textblock darunter nutzen.

Noch besser: Ein h*-Element für die Überschrift, ein p für den Text.

Hm, ein <p> hatte ich deshalb nicht genommen, weil das ja schon wieder Formatierung mit sich bringt? Also einen eigenen Absatz? Und vielleicht noch Anderes... Und wie oben gesagt, waren Tag und Endtag bei meinem Text- bzw. Listen-Element hauptsächlich aus Überlegungen zur logischen Struktur gedacht, während die Formatierung automatisch über das <td>Element passieren sollte.

Und der Sinn an einem <span>Element ist doch grade, dass es standardmäßig keine Formatierung mitbringt, sondern nur Inline-Elemente zusammenfasst? Zumindest hab ich das so verstanden^^'

Allerdings werde ich nach Marcos Anregungen hier wohl in der finalen Lösung eine formatierte Liste benutzen.

Wenn ich das aber versuche, dann geht alles schief...

Inwiefern? - Wie misterunknown schon erwähnt, haben viele Elemente durch die Default-Formatierungen im Browser bestimmte margins, paddings, Schriftgrößen etc. Die muss man dann natürlich entweder hinnehmen wie sie sind (was quasi bedeutet, dass einem diese Werte egal sind), oder explizit auf geeignete Werte setzen.

Das werde ich jetzt dann mal versuchen und meine Ergebnisse/Probleme dann nochmal mitteilen.

Warum ausgerechnet h6? Eigentlich sollte man diejenige h*-Stufe nehmen, die zur Gliederung passt. Wenn dieses Stück also beispielsweise in einem mit h3 überschriebenen Abschnitt steht, sollte es hier h4 sein. Bitte nicht h6 nehmen, nur weil "es dann so aussieht wie gewünscht".

"weil es dann so aussieht wie gewünscht" war nicht meine Überlegung, aus der heraus ich mich für <h6> entschieden hatte. Ich habe <h6> genommen, weil ich eine Überschrift nehmen wollte, und mir sicher war, dass es unterhalb dieser Überschriftenebene keine andere mehr geben wird. Daher die Entscheidung für den niedrigsten <h>-Tag. Die Formatierung wollte ich ja ohnehin selbst übernehmen.

Gut, wenn ich jetzt so drüber nachdenke hätte ich auch sagen können, dass es im Footer auch allgemein keine Überschrift mehr geben wird und demnach <h1> wählen können. Aber der Footer ist ja seinerseits auch wieder Teil der Tabelle, die ja wieder eine Überschrift hat und so wäre die Überschrift des Footers wieder der Überschrift der Tabelle untergeordnet, wodurch <h1> im Footer wieder blöd wäre.
Im Endeffekt ist es wohl eine Sache der Sichtweise welches <h*> man nimmt. Für das Beispiel scheint es mir daher egal zu sein. Aber ich werde für die finale Lösung nochmal drüber nachdenken.

Obwohl ich nach dem selben Prinzip vorgehe wie zuvor, nur eben andere Elemente formatiere, sind die Auswirkungen hingegen komplett anders. Es gelingt mir nicht mehr, so zu formatieren, wie ich es haben will!

Bitte genauer! Wenn es nur unerwartete Abstände sind: siehe oben.

Das ganz kuriose dabei: OBWOHL ich das <h6> Element wieder schließe wirkt es sich trotzdem auf das folgende <span> aus!

Das würde mich wundern. Zwar kann man mit CSS auch ein Element formatieren, das "Nachfolger" eines anderen ist. In deinem Beispiel würde der Selektor "h6+span { ... }" also ein span-Element formatieren, das unmittelbar auf ein h6 folgt. Ich kann mir aber nicht vorstellen, dass ein Browser sowas in seinem Default-Stylesheet stehen hat. Ich vermute eher, dass dein Code da noch einen anderen Fehler hat, der uns im Moment nicht klar ist.

Weitere Aussagen hierzu nach einigen weiteren Versuchen meinerseits, bei denen ich einige Tools und Erkenntnisse anzuwenden versuche, die ihr mir bisher vermittelt habt.

Aber bis hierher: Danke! :)