Centering with CSS inside a div box

Question

Am subbing on a job, would appreciate help:
I am trying to center the three columns inside the address
box at the bottom
of the page.
http://www.mariagrist.net/dev/motors/bodyshop.htm
It should look just like the box at the bottom of the main
page
http://www.mariagrist.net/dev/motors/default.html
but with content centered.
I copied the divs from the default.htm but am changing them
in order to try
to center the content. So far I have only made it worse
because now the
columns are all on top of each other.
Thanks

Answer 1

Thanks heaps, that's exactly what I wanted it to do.
Aren't these forums just magnificent.
"Osgood" <[email protected]> wrote in
message
news:[email protected]...
> Pixel Warrior wrote:
>
>> Am subbing on a job, would appreciate help:
>> I am trying to center the three columns inside the
address box at the
>> bottom of the page.
>>
>>
http://www.mariagrist.net/dev/motors/bodyshop.htm
>>
>> It should look just like the box at the bottom of
the main page
>>
http://www.mariagrist.net/dev/motors/default.html
but with content
>> centered.
>> I copied the divs from the default.htm but am
changing them in order to
>> try to center the content. So far I have only made
it worse because now
>> the columns are all on top of each other.
>> Thanks
> First off you need to change all thress <div
class="address_item_content
> divided"> to <div class="address_item_content">
Just drop the 'divided'
> part.
>
> Next you need to wrap the three newly nmed <divs>
'address_item_content'
> <divs> in another wrapper. See the code below
(scroll down) I've named it
> 'addressHolder'
>
> Find your .address_item_content css and make sure it
looks the same as
> this:
>
> .address_item_content {
> float: left;
> width: 115px;
> padding-left: 30px;
> margin-top: 16px;
> font-size: 11px;
> border-left: 1px solid #000;
> }
>
> add the addressHolder css to your stylesheet.
>
> #addressHolder {
> width: 438px;
> margin: 0 auto;
> }
>
>
>
> Heres the section of code starting and ending with the
> 'address_box_content' <div>
>
> Note to get rid of the 1px solid dividing line on the
left of the first
> 'address_item_content' <div> use some inline css
styling
> 'style="border-left: none;" plus <br style-"clear:
both;"> has been
> inserted after the 'addressHolder'<div> to pull
the 'address_box_content'
> <div> around the three addresses.
>
>
> CODE
>
> <div id="address_box_content">
> <div id="addressHolder">
> <div class="address_item_content" style="border-left:
none;">
> <div id="content_title">DERWENT PARK</div>
> 8c Lampton Ave<br>
> Ph: 03 6211 0660<br>
> </div>
>
> <div class="address_item_content">
> <div id="content_title">DEVONPORT</div>
> 6-8 Victoria Pde<br>
> Ph: 03 6420 4531<br>
> </div>
>
> <div class="address_item_content">
> <div id="content_title">BURNIE</div>
> 60-65 Marine Tce<br>
> Ph :03 6430 2440<br>
> </div>
> </div><!-- end addressHolder -->
> <br style="clear: both;">
> </div><!-- end address_box_content -->
>