margin: auto - but only up to a point

[Tim Streater]

I have an element that I would like to be centred on the page, so I use:

margin-left: auto;
margin-right: auto;

This is fine but under some conditions the element then expands to fill
the whole width of the window (variable content).

I would like to restrict its expansion to within (say) a few pixels of
the sides of the window. Can I do this with CSS?

Thanks,

 

[Jonathan N. Little]

I have an element that I would like to be centred on the page, so I use:

margin-left: auto;
margin-right: auto;

This is fine but under some conditions the element then expands to fill
the whole width of the window (variable content).

I would like to restrict its expansion to within (say) a few pixels of
the sides of the window. Can I do this with CSS?

width: 99%;

 

[Tim Streater]

width: 99%;

This appears to *force* the element (a table) to occupy 99% of the
width. I want to *limit* it to that.

I have:

table.outerbox
{
margin-left: auto;
margin-right: auto;
margin-top: 20px;
border-width: 4px;
border-color: black;
border-style: solid;
}


and then:

<table class="outerbox">
rows, cols
</table>

Thx - tim

 

[Els]

This appears to *force* the element (a table) to occupy 99% of the
width. I want to *limit* it to that.

max-width:99%;

(does not work in IE6)

I have:

table.outerbox
{
margin-left: auto;
margin-right: auto;
margin-top: 20px;
border-width: 4px;
border-color: black;
border-style: solid;
}

and then:

<table class="outerbox">
rows, cols
</table>

You could always wrap it inside a div, and give the div a left and
right padding.

 

[Tim Streater]

max-width:99%;

(does not work in IE6)

Didn't work in Safari 3, FF Mac/Win either

You could always wrap it inside a div, and give the div a left and
right padding.

Bit of a hack, but this *did* work. Thanks.