Posted By

vagrantradio on 06/07/10

Tagged

Versions (?)

Last Edited at 06/07/10 04:26pm

Statistics

Viewed 889 times

Favorited by 3 user(s)

Related snippets

How to Make All Browsers Render HTML5 Mark-up Correctly â€“ Even IE6

/ Published in: HTML

HTML 5 provides some great new features for web designers who want to code readable, semantically-meaningful layouts. However, support for HTML 5 is still evolving, and Internet Explorer is the last to add support. In this tutorial, weâ€™ll create a common layout using some of HTML 5â€™s new semantic elements, then use JavaScript and CSS to make our design backwards-compatible with Internet Explorer. Yes, even IE 6.

Highlighted TextExpand

<!DOCTYPE html>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<html>
        <style>
	 /* Make HTML 5 elements display block-level for consistent styling */
	 article, aside, figure, footer, header, hgroup, menu, nav, section {
	  display: block;
	 }
        </style>
<script type="text/javascript>
document.createElement("article");
document.createElement("aside");
document.createElement("figure");
document.createElement("footer");
document.createElement("header");
document.createElement("hgroup");
document.createElement("menu");
document.createElement("nav");
document.createElement("section");
</script>
		<head>
		    <title></title>
		</head>

<div id="main">
                                <article>
				   <hgroup>
				      <h2>Post 1</h2>
				       <h3>This one's first</h3>
				    </hgroup>
				<p>...</p>
				</article>
			</div>

URL: http://net.tutsplus.com/tutorials/html-css-techniques/how-to-make-all-browsers-render-html5-mark-up-correctly-even-ie6/

Report this snippet Tweet