March 8, 2012
How to set vertical-align of span to middle of a div
Question by StevenChow
I test vertical-align with a simple html code, but it doesn’t work
<div style="height:45px; border: solid 1px black;">
<strong style="vertical-align:bottom;">
abc
</strong>
</div>
Plz help me!
Answer by Starx
This is how you do it
<div style="height:45px; border: solid 1px black; display: table;">
<strong style="vertical-align:bottom; display: table-cell;">
abc
</strong>
</div>
Demo
As I have mentioned before, vertical aligns are very tricky. For this to work, like it did on table, set the parent container to display as table and the inner <div>s or elements to display as table-cell
