1 reply [Last post]
webman81
webman81's picture
Offline
Regular
Last seen: 6 years 26 weeks ago
Timezone: GMT+2
Joined: 2012-03-26
Posts: 16
Points: 28

Please help me.
How can I vertical align my text to the center in a table cell?

http://online-marketing-bedrijf.be/DWnieuw/diensten/website-designer.html

I have tried everything and it does not work Sad(

.tableWebsiteDesigner{
display: table;
}

.tableWebsiteDesigner tr td{
vertical-align: middle;
display: table-cell;
}

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 47 weeks 3 days ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

Padding

You have bottom padding on td. Since table elements try to shrink-wrap their content, the content is squeezed in with 1em at the bottom that makes it look as if vertical align is set to top.

Remove the bottom padding, and set height to some sane value. I tested at 2.5em, which seems reasonable.

You have used the wrong tags on the headers. Instead of

<td 
    valign="middle" 
    class="tableHeader">
...
</td>
use the th element tag.
<th>
...
</th>

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.