How do I line up 3 divs on the same row

Part one-

<div>
<h2 align="center">San Andreas: Multiplayer</h2>
<div align="center" class="float-left">CONTENT OF COLUMN ONE GOES HERE</div>
<div align="center" class="float-left">CONTENT OF COLUMN TWO GOES HERE</div>
<div align="center" class="float-left">CONTENT OF COLUMN THREE GOES HERE</div>
</div>

And inside CSS file-

.float-left {
float:left;
width:300px; // or 33% for equal width independent of parent width
}