Place a div next to another div?

I am trying to place a div next to an UL on the same line, but I can't seem to make it work. I want both of them to be contained inside another div tag that centers everything. I can get one or the other to work.

I am having trouble with .content and .points. I need .content to be on the left, and .points to be on the right, but I still need the .alignall to keep them centered. When I try the float tag it overrides the .alignall and I can't figure out how to center .content and .points. Thanks!

My CSS:

<style type="text/css">

.alignall p {

width:800px;

margin-left:auto;

margin-right:auto;

}

.heading {

font-size: 50px;

color:#009;

font-weight:bold;

}

.bodyimg {

margin-left:120px;

margin-top:-40px;

}

.points {

list-style-image: url(InnovationFiles/bullet.png);

}

</style>

My HTML:

<div class="alignall">

<div class="heading">

<p>Size Doesn't Matter</p>

</div>

<div class="bodyimg">

<p><img src="InnovationFiles/innovation01.png" /></p>

</div>

<div class="content">

<p>No matter how big (or small) you think your equipment is, it's the perfect fit. Here at Hookah Homes Laboratory, we've found a way to change the mantra of "one-size-fits-all" to "one-size-is-all-you-need." You my be asking, what wizard sorcery is this? With inspiration from high school geometry, and embarassment from a diving board incident in a high school swim class, we re-discovered height and width adjustments. Say thanks to Mrs. Butts.</p>

</div>

<div class="points">

<ul>

<li>Five different heights</li>

<li>Easily adjustable choke</li>

<li>Lightweight and collapsible</li>

</ul>

</div>

<div class="links">

<p><a href="innovation.html">Fully Adjustable</a><hr style="width: 1px; height: 5px;"></p>

</div>

</div>