Vertical Align Side by Side Divs

It is very common need to vertically align two elements with unknown heights in a div or vertical align side by side divs. With this approach, you can design a modern layout of WordPress theme or it may be other requirement of your web design project.

wpflask-css-div-side-by-side

Here we are going to share an easy and cross browser CSS solution of this need.

CSS Code

We have highlighted the main concept in the CSS code.

.div-one {
	display: inline-block;
	margin: 0 15px 0 0;
	vertical-align: middle;
	width: 350px;
}
.div-two {
	display: inline-block;
	vertical-align: middle;
	width: 430px;
}

Playground

Here is a practical approach of this need that how can you use this in the designing of a WordPress theme post layout.