Center slice table vertically

[Legacy_Staff]

Could someone have a look at this for me and advise how to center this table vertically so all the component slices line up correctly within it please?
I have it working in HTML already but I'm trying to use CSS and can't figure it out.
I'm a CSS total n00b.

[gaz545]

if you ment horrizontaly, add margin: 0px auto;
into your style for #table_01

and if you did mean verticly, add margin-top: 50%; instead.

Should do the trick.

[Legacy_Staff]

Thx for reply.
I'm trying to align the table to the centre, instead of the left.
Tried both of those suggestions but the first didn't seem to do anything, and the second aligns the table to the bottom, but still on the left (actually, this would be useful for something I'm trying to achieve elsewhere ).
*sigh*

[herkalees]

This is what I do:

div#box {
width: 800px; <-- must declare a width
height: 600px; <-- must declare a height
position: relative;
top: 50%; <-- this puts the top edge half way down the page
left: 50%; <-- this puts the left edge half way across the page
margin-top: -300px; <-- this pulls the box up by half of it's own height
margin-left: -400px; <-- this pulls the box back to the left by half of it's own width
}


That should do ya.

[Legacy_Staff]

Thanx Herk',
I used part of your suggestion and it's fixed it up a treat.


Original code:
#Table_01 {
position:absolute;
left:0px;
top:0px;
width:850px;
height:170px;

Ammended code:
#Table_01 {
position:absolute;
left:50%;
top:0px;
width:850px;
margin-left: -425px;
height:170px;

Many thx for assists guys.
Maybe back later, heheh.

[herkalees]

Originally Posted by RedSkwirrell

#Table_01 {
position:absolute;
left:50%;
top:0px;
width:850px;
margin-left: -425px;
height:170px;

I'm not 100% sure of this, but the choice of using 'absolute' as your value for the 'position' property might mess up anything you put below that div 'Table_01'

Of course, if you haven't mentioned it, I'm probably wrong

[masonbarge]

Yeah, I agree, but relative positioning has its own drawbacks sometimes. I think we've all been through "why the heck won't this go into that empty space"

[Legacy_Staff]

I had noticed you'd used the relative tag but the image centres okay and it appears as it's meant to... I ain't doing nuttin else unless it's broke!


(Will let you know later if it breaks)

[Colin Green]

Thank you Herkelees I will try that.
well done
Colin

[Colin Green]

Thank you
Colin