Vertically align div (no tables)

Question

I can horizontally align a div and all the content looks nice. Looking to vertical align a div that does not contain any tables. I tried setting margin positions to some neg

Answer 1

CSS class to align a element in middle of the screen:

.middle{
    position: absolute;
    top: 50%; /*50% from top*/
    left: 50%; /*50% from left*/ 

    /*remove 50% of element width and height to align the element center in the position*/
    transform: translateY(-50%) translateX(-50%); 
}

Now, add this class to HTML element

Answer 2

Make a container div with style display: table and use the style vertical-align: top on inner elements that are display: inline-block

Working demo at http://jsfiddle.net/uzcrt/