Div lado a lado sem Float

by Rafael Nepomuceno

HTML

<div class="container">
	<div class="top-example">
		<div class="wrap">
			<div class="left">
				<span>Content of Left</span>
			</div>
			<div class="right">
				<span>Content of Right</span>
			</div>
		</div>
	</div>
</div>

CSS

.top-example {
    margin: 0 auto;
    max-width: 600px;
    border: 1px solid red;
}
.wrap {
    display: table;
    width: 100%;
   padding: 15px;
    box-sizing: border-box;
}

.left,
.right {
    display: table-cell;
    border: 1px solid blue;
}
.right {
    text-align: right;
}