CODEWITHSUNDEEP
htmlcss
Cheezey
Cheezey

Reputation: 720

Text in table is vertically centered

I have this table:

<table border="1" style="width:100%">
    <tr>
        <td>Message</td>
        <td>Preview:</td>
    </tr>
    <tr>
        <td width="50%">
            <div style="float:left;">
                <textarea name="message" rows="10" cols="50" onkeyup="preview(this.value)">Enter your message here</textarea>
            </div>
        </td>
        <td style="background-color:rgb(255, 170, 0);" id="preview">
            <div>Enter your message here</div>
        </td>
    </tr>
</table>

It's a textarea with a preview of how it will look next to it. However, all the text in the preview cell is vertically centered, when I want it to start at the top.

How can I fix this?

Upvotes: 1

Views: 106

Answers (3)

Bhavesh G
Bhavesh G

Reputation: 3028

add following code in css,

table tr td {
vertical-align:top;
}

Upvotes: 0

beno&#238;t
beno&#238;t

Reputation: 1483

use vertical-align:top (by default it's work for table not other html element) read this: http://www.w3.org/wiki/CSS/Properties/vertical-align

Upvotes: 0

Simon Dorociak
Simon Dorociak

Reputation: 33515

<td style="background-color:rgb(255, 170, 0); vertical-align: top;" id="preview"><div>Enter your message here</div></td>

Just add vertical-align: top property and then it should works.

Upvotes: 2

Related Questions