Samstag, 20. Februar 2010

HTML-Tabellen in Blogger.com erstellen

Ein Informationsbeitrag für Nutzer von Blogger.com - womöglich uninteressant für den Großteil der Leserschaft!

In meinem letzten Beitrag versuchte ich eine Tabelle mit allen prognostizierten Bundesliga-Ergebnissen zu erstellen. Da uns der Blogger.com-Editor von Haus aus keine Möglichkeit bietet an den gewünschten Effekt zu gelangen, versuchte ich mich an meinen überschaubaren HTML-Kenntnissen.

Rasch in den "HTML bearbeiten"-Modus gewechselt und fleißig losgewerkelt. Um ein paar <center>-Tags und für diesen Beitrag unwichtige Inhalte erleichtert, sah der entstandene Code für eine Tabelle folgendermaßen aus:

<table>
<tr>
<td>Hoffenheim</td><td>Gladbach</td>
</tr>

<tr>
<td>Nürnberg</td><td>Bayern</td>
</tr>

<tr>
<td>Köln</td><td>Stuttgart</td>
</tr>

</table>

Über den speziellen Vorschau-Modus zeigte es die gewünschte Tabelle an. Nachdem der Beitrag jedoch für alle Welt veröffentlicht wurde, haute es mir einen riesigen Leerraum über die frisch getippten Zeilen.



Das Problem für den unerwünschten freien Raum liegt scheinbar in der Blogger.com-Software. Mein Fehler war, dass ich die einzelnen Tags in HTML am liebsten, wie im oberen Code gut zu sehen, schön übersichtlich in jeweils gesonderte Zeilen schreibe. Da das System im tückischen "HTML bearbeiten"-Modus aber auch offensichtlich ein stinknormales "Enter" als <br /> ansieht, platzierte er diese Kommandos - natürlich wegen logischer Deplatzierung zwischen z.B. <table> und <tr> - vor die Tabelle.

Des Rätsels Lösung lautet also, dass die Übersicht bei geschriebenem HTML-Quelltext etwas kürzer treten muss! Am besten solltet ihr eine Tabelle komplett ohne Leerzeilen und -zeichen schreiben.
Um das obere Beispiel erneut aufzugreifen, sieht der korrekte Code wie folgt aus:

<table><tr><td>Hoffenheim</td><td>Gladbach</td></tr><tr><td>Nürnberg</td><td>Bayern</td></tr><tr><td>Köln</td><td>Stuttgart</td></tr></table>

Zwar erscheint es so viel chaotischer, doch erreicht ihr mit dieser Lösung eine korrekt dargestellte Tabelle ohne darüberliegenden Leerzeilen.

Und noch ein abschließender Tipp zu einem ganz anderen Thema: Um den geschrieben HTML-Quellcode in euren Postings anzeigen zu lassen - dass er also nicht direkt in die jeweiligen Codes umgewandelt, sondern wie bei mir ausgeschrieben wird - schreibt ihr einfach anstelle der eckigen Klammern ("<" bzw. ">") die Befehle "& lt;" und "& gt;" (wobei natürlich keine Leerzeichen enthalten sein dürfen).


MfG
Christoph "Yaab" Lucassen

1 Kommentar: