How to float 3 divs side by side using CSS?

Dameon picture Dameon · Jan 28, 2010 · Viewed 758.7k times · Source

I know how to make 2 divs float side by side, simply float one to the left and the other to the right.

But how to do this with 3 divs or should I just use tables for this purpose?

Answer

Nick Craver picture Nick Craver · Jan 28, 2010

Just give them a width and float: left;, here's an example:

<div style="width: 500px;">
 <div style="float: left; width: 200px;">Left Stuff</div>
 <div style="float: left; width: 100px;">Middle Stuff</div>
 <div style="float: left; width: 200px;">Right Stuff</div>
 <br style="clear: left;" />
</div>