css padding+margin

[kumarsena]

hey guys,

i got this problem with inconsistencies between ff and ie when it comes to floats. I have a container containing two flaots, left and right. the container has been given the :after treatment to wrap both floats. But the problem is with the following div, the footer. i am adding topmargin to it but it will not move one pixel.

the problem seems to be that the footer is not clearing the container, but only the floats within. am i not getting the float thing properly, or is this some bug. IE is showing it properly, but FF is not, i tried 100px; no result, but 100opx margin does somehow work....

i hope i managed to explaing proeperly, any idea what is going on with ff?

thanks for any help,,
kumar

[Robin_reala]

I think your :after trick is broken. Put a border or background on your container and see if it's really clearing left and right. If it is then the border will enclose them and the footer's margin will work in the way you want it to.

If that doesn't work, can you post some sample code?

[kumarsena]

hey,

tahnks for the reply. I was playing around after i amde the first post and for some reason it is working now, althoug ie has a larger margin than ff. as to what you suggested, i tried it already and yes the container does "contain" the floats.

the :after code is this where the box_cont2 is the container of the two floats. just puutting it here in case it might be broken.

#box_cont2{
margin:0px auto 0px auto;
background-color:#555;

}

#box_cont2:after {
content: ".";
display: block;
height: 0px;
clear: both;
visibility: hidden;
}

/* Hides from IE-mac \*/
* html #box_cont2 {height: 1%;}

thanks for the help

kumar