Jump to content

Vertical align center not truly aligned at vertical center?


sepoto

Recommended Posts

I am trying to figure out why my vertical-align: middle; is not truly aligned to the middle. It appears to be offset quite a bit. I have reviewed my box model and I don't really see a problem (correct me if I am wrong). Does anyone see the solution here? I am a bit lost. Thank you!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html><head><style>table {table-loayout: fixed;width: 1102px;margin: 0;padding: 0;border-collapse: collapse;}td {border: solid 1px black;margin: 0;padding: 0;max-height: 102px;}#square {float: left;height: 100px;width: 100px;margin: 0;padding: 0;overflow: hidden;}</style></head><body><table><tr><td><div id="square"><p id="" style='text-align: center; line-height: 98px;'>x</p></div><div id="square"><p id="" style='text-align: center; line-height: 98px;'>x</p></div><div id="square"><p id="" style='text-align: center; line-height: 98px;'>x</p></div><div id="square"><p id="" style='text-align: center; line-height: 98px;'>x</p></div><div id="square"><p id="" style='text-align: center; line-height: 98px;'>x</p></div><div id="square"><p id="" style='text-align: center; line-height: 98px;'>x</p></div><div id="square"><p id="" style='text-align: center; line-height: 98px;'>x</p></div><div id="square"><p id="" style='text-align: center; line-height: 98px;'>x</p></div><div id="square"><p id="" style='text-align: center; line-height: 98px;'>x</p></div><div id="square"><p id="" style='text-align: center; line-height: 98px;'>x</p></div><div id="square"><p id="" style='text-align: center; line-height: 98px;'>x</p></div></td></tr></table></body></html>

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...