Div Sizing/Positioning

[Cristofori]

Howdy -

I'm trying to create a div where the top and bottom margins are always a fixed distance away from the side of the browser window so that it will stretch to fit the window when it is resized.

In Firefox I can do the following

div.xxx
{
position: absolute;
top: 10px;
bottom: 10px;
left: 10px;
width: 100px;
}

which will create a sidebar on the left side, but IE will always shrink the div to the size of whatever contents are in it.

Is there a better way to do what I'm trying to accomplish so that it will work in IE as well?

Thanks!

[WebJoel]

Howdy -

I'm trying to create a div where the top and bottom margins are always a fixed distance away from the side of the browser window so that it will stretch to fit the window when it is resized.

In Firefox I can do the following

div.xxx
{
position: absolute;
top: 10px;
bottom: 10px;
left: 10px;
width: 100px;
}

which will create a sidebar on the left side, but IE will always shrink the div to the size of whatever contents are in it.

Is there a better way to do what I'm trying to accomplish so that it will work in IE as well?

Thanks!

change:
width:100px; to width:auto; (to make it 'fluid'), and then add:

margin:0 auto;

This will place "zero" pixels at the top, and 'auto-adjust' the right, bottom and left sides.
Or you can define sides in this order: top-right-bottom-left, so

margin:10px 50px 25px 50px;
means 10-pixels at the top, 50-px to the right, 25-px to the bottom, 50px to the left. Or combinations like "margin:10px auto 25px auto;" is 'self-adjust sides' with 10-px top and 25-px bottom... see? :)

[Cristofori]

Thanks for the info! That definately took me in a step in the right driection. The problem now is that the sides will fixate themselves the specified distance from the side of the browser window, but the div will not stretch out vertically.

Thus if I use something like

div.xxx
{
margin: 10px 10px 10px 10px;
}

the div is 10 pixels away from the top, left and right sides but it shrinks vertically depending on the content. Any ideas?

Thanks!