Menu
I'm writing a new website in HTML5 and CSS3. I need to make some inner wrappers to center the content (960px wide). I usually do this via something like
<style>
.nav { height:40px; background:#000; }
.wrapper { width:960px; margin:auto; }
</style>
<div class="nav">
<div class="wrapper">
Home News Blog etc etc
</div>
</div>
However, I am new using the new HTML 5 elements such as header, nav, article etc and am wondering the best way to make a wrapper similar to above but in a better way?
642
This is actually legal:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Wrapping up HTML5</title>
</head>
<body>
<div id="wrapper">
<header><h1>Using a HTML5 wrapper</h1></header>
<section>
<article>
<hgroup>
<h1>This is actually legal</h1>
<h2>Just wrap everything in a div, just like before</h2>
</hgroup>
<p>But it's probably better to simply use the body tag.</p>
</article>
</section>
<footer><p>Love from Kebman</p></footer>
</div>
</body>
</html>
However, it is probably advicable to simply use <body> as a wrapper. After all, it's cleaner and adds less HTML.
147
If you are looking for alternative methods, you can also use the body
body{ margin: 0 auto; width: 960px; }
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
