kostenloser Webspace werbefrei: lima-city


Tabelle - Zeilenhöhe

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    sincer

    Kostenloser Webspace von sincer

    sincer hat kostenlosen Webspace.

    ho ;)

    Hab mal wieder eine Frage an HTML- und CSS-Kenner :D

    Und zwar habe ich eine tag/tabelle">Tabelle mit einer unterschiedlichen Zeilenanzahl pro Spalte

    Das ganze sieht so aus, dass es zwei Spalten gibt.
    In der linken Spalte ist eine Zeile (Ein Bild - zwischen 100px und 120px hoch)
    In der rechten Spalte gibt es 4 Zeilen.

    <table>
      <tr>
        <td rowspan="4">FOTODATEI</td>
        <td>Beschreibung – Datum</td>
      </tr>
      <tr>
        <td>Fotos gemacht von</td>
      </tr>
      <tr>
        <td>Ansehen</td>
      </tr>
      <tr>
        <td>Download</td>
      </tr>
    </table>


    So... Da das Foto aber höher ist, als 4 schriftliche Zeilen, werden die Zeilen auseinander gezogen.

    Zur Verbildlichung: (Der Quote-Strich simuliert mal das Bild XD )

    Ich hätte gerne:
    Beschreibung
    Fotos von
    Ansehen
    Download





    Stattdessen bekomme ich:
    Beschreibung

    Fotos von

    Ansehen

    Download


    Ist etwas blöd zu erklären, aber ich hoffe, ihr wisst, was ich meine...

    In meinen Augen gibt es schon eine Lösung:
    Eine Zeile, eine Spalte...
    Links das Bild, und rechts vier Zeilen (in einer Spalte mit <br /> getrennt...)
    Dann wären die 4 Schriftzeilen mit normalem Abstand.

    Allerdings finde ich diese Sache nicht wirklich hübsch, und hoffe auf ein wenig Raffinesse von denen, die sich etwas besser damit auskennen :)

    Vielen Dank im Voraus für alle Tipps
    Sincer

    Beitrag zuletzt geändert: 7.9.2009 17:26:52 von sincer
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. w******s

    Hallo,

    haste einen Link?

    Ich glaube das könnte wirklich schwer werden. Man könnte vllt. versuchen, die einzelnen "td" kleiner zu machen:
    <td style="height:1.2em;">
    Allerdings müsste dann das letzte den restlichen Platz einnehmen.
  4. t****o

    Es könnte auch am cellspacing liegen.

    MfG
    telelo
  5. e********l

    Wozu überhaupt eine Tabelle?

    Vier Paragraphen und ein das Image nach links floaten lassen. Dann noch genügend Margin für das Bild setzen und gut ist.
    Alternativ tut es auch eine Tabelle mit nur einer Zeile und 2 Spalten.
  6. aldistammkunde

    Kostenloser Webspace von aldistammkunde, auf Homepage erstellen warten

    aldistammkunde hat kostenlosen Webspace.

    hallo,
    vielleicht weniger elegant, aber falls alle Stricke reißen:

    in der rechten Spalte genauso viele Zeilen erstellen wie in der rechten, dann für diese Zellen
    <td style="vertical-align:top;">

    setzen und in der Zelle selbst eine zweite Tabelle oder ein paar <p>s oder <div>s statt der bisher verwendeten Zellen nutzen.
    Also in etwa:

    <table>
    <tr><td><img src=""></td><td style="vertical-align:top;"><p style="margin:1px">Punkt1</p><p style="margin:1px">Punkt2</p></td></tr>
    </table>


    natürlich würde ich mir dann für die <p>s ne geeignete Klasse schreiben...und das da nicht direkt reinquetschen

    Beitrag zuletzt geändert: 7.9.2009 18:00:10 von aldistammkunde
  7. Autor dieses Themas

    sincer

    Kostenloser Webspace von sincer

    sincer hat kostenlosen Webspace.

    @werktags:
    JAU :)
    werktags schrieb:
    Allerdings müsste dann das letzte den restlichen Platz einnehmen.

    Dafür gibt es ja dann vertical-align:top; Dann wäre zwar der Platz größer, aber sehen könnte man es nicht mehr...

    Funktioniert perfekt - Danke ;)

    Auch an alle anderen ein Dankeschön.
    //EDIT: Eure Lösungsvorschläge sind meiner Meinung nach auch machbar, allerdings habe ich für heute (aus welchem Grund auch immer) das Gefühl gehabt, dass es eleganter wäre, dass Problem mit einer ganz normalen Tabelle zu lösen XD
    (Ohne Breaks und Divs, usw...)

    Problem gelöst ;)

    thx
    Sincer

    Beitrag zuletzt geändert: 7.9.2009 18:08:40 von sincer
  8. dragonsystems

    dragonsystems hat kostenlosen Webspace.

    vielleicht so:

    <tr heigth="HOEHE">
    <td>
    </td>
    </tr>


    wobei HOEHE die höhe bezeichnet
  9. Nein, die Zeiten sind lange vorbei, heute gibt man die Höhe mit CSS an

    table tbody tr td { height:20px; }


    Außerdem würde ich empfehlen die CSS-Eigenschaften alle in eine externe Datei zu schreiben. der Style-Tag versaut einem nur den Code.
  10. Wer lesen kann ist klar im Vorteil, das Problem wurde schon gelöst...

    ***CLOSED***
  11. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!