rodwater rodwater - 7 months ago 22
CSS Question

centering divs on the same line

I'm trying to center these 3 floated divs on the same line. Here is a link to jsfiddle:

any suggestions?


<div class="content">

<div class="box">

<div class="box">

<div class="box">




.box {
width: 30%;
height: 200px;
float: left;
background: gray;
border: black solid 2px;
box-sizing: border;
margin: 5px;


First the float:left; is not relevant in your case, just like Lal said, instead of float:left; its should be display:inline-block; and you can also add a relative positioning position:relative;