How To Align Divs Horizontally

Here we are going to share with you a code snippet that will help you to achieve the divs in a row or align horizontally. Let write the following code snippet to achieve our desired results.

/** CSS Styles */
.wrapper { 
	max-height: 100px; 
	background: red; 
	overflow-y: hidden; 
}

.rect { 
	width: 100px; 
	height: 100px; 
	background: blue; 
	float: left; 
	margin: 1em; 
}

/** Template */
<div class="wrapper">
	<div class="rect"></div>
	<div class="rect"></div>
	<div class="rect"></div>
	<div class="rect"></div>
</div>

You may also be interested in our other articles on improve wordpress jpeg image quality, increase the size of excerpt field, wordpress adding fields to categories, and exclude categories from blog wordpress.