I want to create a very simple liquid layout with 2 columns - the one to the left will have a fixed width, and the one to the right will be dependent to the window size.
The layout will contain 4 elements - the header, navigation, content, and the footer.
I have a couple of questions according to the semantics of HTML5 elements here.
This is the code:
<body>
<div id="container">
<header>
<div id="header">
sadfsdf
</div>
</header>
<nav>
<div id="nav">
gdfsgf
</div>
</nav>
<article>
<div id="article">
gdffgdg
</div>
</article>
<footer>
<div id="footer">
gdfsgf
</div>
</footer>
</div>
</body>
1) Is container div really necessery? What I do is: HTML has font/lineheight properties BODY has some margins and background images CONTAINER contains the rest
Is it O.K. to put body stuff inside of html, and make body the container?
2) Are inner div's in header, nav, ... necessary? They are in there because I can then change padding, margins and borders without changing the width of the element. Should I rather set this width along with every changes?
1) If the container div is needed or not depends very much on your actual design, but from what I can see from what you have showed, it is not really necessary. What is body stuff?
2) You have answered your question yourself. If you want to prevent an overflow because of padding, margin,border, keep it.