textarea-Komponente und die vertikale Ausrichtung in einer Tabelle

Haben wir eine Tabelle mit zwei Spalten: in jeder Zeile gibt es ein label auf der linken Seite und ein Eingabefeld auf der rechten Seite.
Wir verwenden vertical-align=text-bottom; zu richten Sie die Unterseite der label-text, der am unteren Rand der text in die Eingabefelder ein.

So weit So gut.

Aber manchmal müssen wir eine textarea (mehrere Linien) anstelle der Eingabe-box. Die Unterseite des Etiketts auf der linken Seite ausgerichtet ist mit der Unterseite des letzten Zeile der textarea.

Gibt es eine Möglichkeit zum ausrichten der text auf der linken Seite mit der ersten Zeile der textarea?

Einem vereinfachten Beispiel

<table class="waiFormTable">
  <tr>
    <td><label>Label 1:</label></td>
    <td><input id="id" type="text" name="name" value="value" /></td>
  </tr>
  <tr>
    <td><label>Label 2:</label></td>
    <td><textarea id="id" type="text" name="name" value="value" /></td>
  </tr>
</table>

in der CSS definieren wir:

table.waiFormTable thead tr,
table.waiFormTable tbody tr {
  vertical-align: text-bottom;
}

In diesem Beispiel möchte ich haben " - Label 1:" text-bottom ausgerichtet mit der ersten Zeile der textarea.

  • Kann man ein jsfiddle und sind Sie offen für eine javascript-Lösung?
  • Ein Kommentar auf der down-vote ist immer willkommen...
InformationsquelleAutor Matteo | 2011-08-31
Schreibe einen Kommentar