Wednesday, November 16, 2022

[FIXED] How do I vertical align cell content in a table in HTML?

Issue

i found the answers. but it doesn't work for me. please take a look at the code and tell me why user avatar is in the middle of the cell and not on the top

<http://jsfiddle.net/7nvku6zp/>

Solution

Your selector is wrong

table.tablePost, tr.tablePost, td.tablePost {
  border: 1px solid black;
  vertical-align: top;
}

Means "apply the following to either a table, tr or td that all have the tablePost class". You don't have any td elements that have this class, only your table has it.

I can't really tell what you want your styles to look like but it might be this:

table.tablePost {
  border: 1px solid black;
}

table.tablePost td {
  vertical-align: top
}

Which means "apply the border to any table elements with the tablePost class. Apply vertical-align to any td elements that are the children of any tables with the tablePost class."



Answered By - Alex
Answer Checked By - Pedro (PHPFixing Volunteer)

No comments:

Post a Comment

Note: Only a member of this blog may post a comment.