Not sure why but for the life of me I cannot get my text to align on the top of a table cell (td) when the cell before it is wrapping text.
If I write it out in the HTML it works, but unable to get the same effect in my CSS.
Works with HTML:
<td style="vertical-align:text-top;">Some Text</td>
Doesn't with CSS:
table td { vertical-align: text-top; }
And I have tried every combination you can think of within my CSS
To place an item at the top or bottom of its cell, insert the "VALIGN=" attribute within the code for that cell. To vertically align an entire row (e.g., placing all data in that row at the tops of the cells), insert the "VALIGN=" attribute within the code for that row.
HTML | <td> valign Attribute The HTML <td> valign Attribute is used to specify the vertical alignment of text content in a cell. Attribute Value: top: It sets the content to top-align. middle: It sets the content to middle-align.
Make sure you are not setting "display: block" on the TD elements, as vertical align doesn't work on block elements. Also, text-top is not the best, and has some cross browser issues. Use "top" instead. Try adding this in your stylesheet:
table td {
display: table-cell;
vertical-align: top;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With