html - Some doubts related to the clear property on the footer in a tabless layout -

i have implement following fixed tabless layout using html+css: http://onofri.org/example/webtemplate/

(i have finalize settings)

this layout have 2 floatted columns #content , #sidebar , under these columns there placed footer div #footcontainer

ok, have clear elements place under tow columns (bring elements in normal flow of document), use clear css property.

i have read in differents way.

in example have created empty div having id clearer2 have following css settings:

#clearer2{     clear: both; } 

this work well, know clear directly footercontainer, in way:

#footcontainer {     clear: both;     width: 100%;     min-height: 200px;     height: auto !important;     height: 200px;     background: #4f4f4f url(../images/bgfooter.jpg) repeat-x 0 0;     box-shadow: 0 -13px 25px 5px #b2b2b2; } 

at logic level should same thing because set clear: both; property on item , property valid successive items. reading online seems me first solution better second one. why better creat new item (as empty div) clear directly on appropriate element (in example div #footercontainer)

the solution have use valid solution?

tnx

andrea

divs clear: both property make parent divs expand height 1 expect when have floated divs inside, explained in http://www.quirksmode.org/css/clearing.html (labeled "the old solution").

so in example, clear: both achieving. don't need reset normal flow, because main divs (#container , #footcontainer) on same div hierarchy level, , not floated.

you may want add these properties #container make expand correctly:

#container {     ...     overflow: auto;     width: 770px; /* needed older browsers */ }