http://asp.snowstop.net/blog/?id=227&date=2007-11
The unavoidable redundant tags in div css layout strictly follow w3c standards It is impossible to lay out the web page. If you want to display a beautiful web page under different versions of browsers, it is almost inevitable to use some redundant tags.
In summary, there are three main places where redundant tags must be used in div layout:
First, the background image and background color, when the css attributes of the inner elements are all "float:left" , the outer background will not be displayed in browsers such as Mozilla. At this time, you must nest a background layer between the inner and outer layers, or add an empty tag of "clear:both" at the end of the inner element.
Second, when the page width is an absolute value, a div with a width equal to the sum of the absolute values must be nested outside the parallel element with a float attribute to ensure that the float element will not "fall" when the page is scaled.
Third, when you need to write the bottom information bar, because you cannot use position:absolute positioning, you must nest a div outside all float parallel elements to ensure automatic height expansion. At the same time, the bottom information bar should have the "clear:both" attribute.
My final solution is to add a