hugo: Zeilenabstand innerhalb einer Table

Hallo liebe HTML-Experten! :)

Ich habe folgende Frage:

Auf dieser Seite (http://das-gizmo.de.ms/index_1.htm) gefällt mir der Zeilenabstand des Haupttextes (Begrüßung) gut. Aber um um diesen Textblock einen seitlichen Abstand herum zu bekommen, habe ich den Text in eine Table kopiert, wie man auf dieser Seite (http://das-gizmo.de.ms/index.htm) sehen kann. Allerdings ist dabei der Zeilenabstand deutlich geringer geworden, was mir nicht gefällt. Und leider weiss ich nicht, wie ich das korrigieren kann. Oder gibt es vielleicht eine elegantere Version?

Habt schonmal recht herzlichen Dank für's Lesen und evtl. Antworten. ;)

Liebe Grüße,

hugo

  1. Hallo,

    Auf dieser Seite (http://das-gizmo.de.ms/index_1.htm)

    Bitte gib keine nervigen Umleitungs-URLs an, sondern
    die richtige URL, und die bitte als Link (</faq/#Q-19>):
    http://home.arcor.de/das-gizmo/index_1.htm
    http://home.arcor.de/das-gizmo/index.htm

    Die Loesung Deines Problems heisst CSS.
    http://selfhtml.teamone.de/css/index.htm

    Beschaeftige Dich mit dem Box Model.
    Mit margin und padding fuer das entsprechende Element
    kannst Du alle Abstaende steuern.
    http://selfhtml.teamone.de/css/eigenschaften/randabstand.htm
    http://selfhtml.teamone.de/css/eigenschaften/innenabstand.htm

    Hinweis: Verschachtelte Tabellen und Blind-GIFs sind out.

    Gruesse,

    Thomas

    1. Hallo Hugo, Hallo Thomas,

      und

      line-heigth:...;

      Hinweis: Verschachtelte Tabellen und Blind-GIFs sind out.

      Yeeps

      Gruesse Dacor

      1. Hallo Dacor,

        ich bin für Alternativen offen!

        Gruß,

        hugo

    2. Hallo Thomas!

      Bitte gib keine nervigen Umleitungs-URLs an, sondern
      die richtige URL, und die bitte als Link (</faq/#Q-19>):

      Entschuldige bitte.

      Die Loesung Deines Problems heisst CSS.
      http://selfhtml.teamone.de/css/index.htm

      Beschaeftige Dich mit dem Box Model.
      Mit margin und padding fuer das entsprechende Element
      kannst Du alle Abstaende steuern.
      http://selfhtml.teamone.de/css/eigenschaften/randabstand.htm
      http://selfhtml.teamone.de/css/eigenschaften/innenabstand.htm

      Vielen Dank für deine Hilfe. Jedoch würde es mich dennoch sehr interessieren, wieso sich der Zeilenabstand verändert. Es muss doch auch eine Möglichkeit geben, diesen innerhalb der Tabelle (die für den Rand zuständig ist) beizubehalten. Würde mich diesbezüglich über eine Antwort sehr freuen.

      Hinweis: Verschachtelte Tabellen und Blind-GIFs sind out.

      Wieso eigentlich? Genau das hat auch schon Dacor geschrieben. Ist das sowas wie 'ne Vorgabe?

      Lieben Gruß,

      Hugo

      1. Hallo,

        Jedoch würde es mich dennoch sehr interessieren, wieso sich der Zeilenabstand verändert.

        Solange nichts bestimmtes definiert ist, sind die Browser frei,
        wie sie es darstellen wollen. Sie tun einfach "ihr bestes"...

        Es muss doch auch eine Möglichkeit geben, diesen innerhalb der Tabelle (die für den Rand zuständig ist) beizubehalten.

        Gib den Tabellen-Zeilen eine Hoehe.
        CSS:
        table.navigation tr { height:1.5em; }
        HTML
        <table class="navigation">
          <tr><td>Home</td></tr>
          <tr><td>Kontakt</td></tr>
          <!-- u.s.w. -->
        </table>

        Hinweis: Verschachtelte Tabellen und Blind-GIFs sind out.
        Wieso eigentlich? Ist das sowas wie 'ne Vorgabe?

        Diese Methoden waren in den duesteren, alten Zeiten des Webs
        (ca. 1997) die einzigen Moeglichkeiten fuer grafisch anspruchsvolle
        "Webdesigner", "pixelgenaues" Layout anzustreben.
        Schon damals waren sie allerdings "Holzhammermethoden".

        Diese Dinge (Abstaende u.s.w.) nicht mehr mit HTML und Blind-GIFs,
        sondern mit CSS zu loesen, ist eine klare Tendenz, die auch vom
        World Wide Web Consortium (W3C) empfohlen wird.

        Zu den Vorteilen von CSS verweise ich Dich mal aufs </archiv/>.
        Um nur ein paar zu nennen:

        • Trennung von Inhalt/Struktur und Layout
        • der HTML-Quellcode wird uebersichtlicher, einfacher zu bearbeiten
              und viel kleiner (Ladezeiten)
        • riesige Zeitersparnis bei Layout-Aktualisierungen
             (nur 1 CSS-Datei muss geaendert werden, statt
              *zig bis *hunderte von HTML-Dateien)
        • Dank verschiedenen Stylesheets fuer verschiedene Ausgabemedien
             reicht eine HTML-Datei als Bildschirm- und Druckversion;
             "unerwuenschte" Bereiche (z.B. Navigation) kann man beim Drucken
             einfach mit display:none ausblenden.

        Um Dein 2-Spalten-Layout zu erreichen, reicht - wenn ueberhaupt - _eine_ grosse
        Layout-Tabelle rund um alles. (CSS-Hardliner wuerden auch das mit CSS hinkriegen,
        vielleicht posten sie ja auch noch ein paar Links zu Seiten, die so gemacht sind...)

        Die Navigationsleiste in der Linken Spalte kannst Du mit einer <ul>-Liste machen.
        Vorteil in Deinem Fall: UL-Listen werden von keinem mir bekannten Browser
        "automatisch" in der Hoehe angepasst, wie es offenbar mit Deiner Tabelle geschieht.

        Nochmal ein paar Links:
        * Das CSS-Kapitel in SelfHTML:
          http://selfhtml.teamone.de/css/index.htm
        * Links zu CSS:
          http://aktuell.de.selfhtml.org/links/css.htm
        * Ein paar Vorschlaege fuer Spalten-Layouts mit CSS:
          http://glish.com/css/

        Gruesse,

        Thomas