Web Hosting Talk : Web Hosting Main Forums : Web Design and Content : CSS problem

[hehachris]

http://daplugin.com/xhtml/temp.shtml

Looks fine in IE but not in Firefox.

The side bar and contents are inside body_container, I dont understand why the height of body_container is not being enlarged to the actual height of the contents.

This is my first attempt to use XHTML+CSS to replace tables. Any advice will be appreciated.

[bear]

Tried adding height declaration to this def?
#body_container {
width: 780px;
height:100%;
margin: 0px auto 0px auto;
background: transparent url(images/body_bg.png) top left repeat-y;
}

You might also need to fool with the overflow properties.

[hehachris]

Thanks for you reply. I have tried that but nth changed.

[EncoderZ]

The daplugin has a copyright on the bottom, click that and the site GVT manages it.

Right click the page to view source and then open their .css and it should tell you how they've done it - as it looks fine in Kmeleon (mozilla) browser

[hehachris]

the gvt site is also created by me...-.-
It is an old work and I still used tables.

[EvilivE]

This is not working as you expected because #contents is floated which in turn takes the element out of the normal document flow.

In order to get the effect that you intended you will have to also float #body_container or "un-float" #contents.

HTH

[hehachris]

thanks EvilivE. I put "float: left" to #body_container and it works =]

[drhowarddrfine]

The problem you were having is a bug in IE. Containing elements are NOT to expand to contain floats. There were other ways to get modern browsers to do what you want but you're problem is fixed.