Vertically align elements in CSS

There are times in CSS that one will have to meddle with the CSS attribute vertical-align: middle.

As most of you have realized, it doesn't really work every single time. I wish it was that easy to vertically align some text in a div to the center, like text-align property.

One neat trick I've discovered was:

div {
    height: 40px;
    line-height: 40px
    font-size: 16px
    …
}

By setting the line-height and height to be the same values, your text content gets vertically aligned to the middle auto-magically.

If anyone has any suggestions or comments, they are more than welcome.