What is the simplest way of clearing floats in webkit?

Question

I'm making a Google Chrome plugin. Therefore, the injected CSS need only work in webkit. What is the webkit-specific way of clearing floats?

By clearing floats, I mean make a parent element enclose all floating children contained within.

Answer 1

If you don't need to care about the IE bugs, you can make a clearing style (for an element not to take up space) as simple as:

.Clear { clear: both; height: 0; }

as comparison, a style that takes the IE one-character-height bug into acount would be:

.Clear { clear: both; height: 0; overflow: hidden; }

An alternative to adding a clearing tag, is to set an overflow style on the parent element of the floats, that will make it contin it's children. You can for example use overflow:hidden but without specifying a size, that way the parent will be sized by it's children.

Answer 2

display: inline-block did the trick.