Nested div layouts seem to conflict with the principle of "separation of layout structure from content"!
In order to reasonably implement the layout of the XHTML+CSS format, it seems unavoidable to write nested <div> tags in the HTML file of the Web page content in order to achieve those common layout forms. Like what:
...
<body>
<div id= "Header" >this is header</div>
<div id= "Main" >
<div id= "Navigater" >this is navigater</div>
<div id= "Content" >this is content</div>
</div>
<div id= "Footer" >this is footer</div>
</body>
...
Then define the style attributes for each div in the CSS file. Obviously, the <div> tag named "Main" was simply added to control the layout of the "Navigater" and "content" two <div>. As a result, nested <div> HTML code is formed.
The problem is that if you change the layout of the page in the future, you need to put the navigater somewhere else, such as above the header. I'm afraid that when you modify the CSS file, you must also modify the HTML file that reflects the content to remove the nested <div> form. Because the nested <div> structure is actually written to the HTML content for layout purposes.
Thus, violates the XHTML+CSS standard advocated "the layout and the content separation" principle!
I do not know how to look at this issue?
A little more bricks to hit me, to hit me sober.