Skip to content

Instantly share code, notes, and snippets.

@seantimm
seantimm / content.html
Created March 18, 2012 22:42
Separation of Concerns
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title>Unobtrusive JavaScript</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<span>Click Me!<em>Thanks!</em></span>
<!-- Code below is to toggle source and load scripts -->
@seantimm
seantimm / content.html
Created March 19, 2012 05:21
Default Styles
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title>Default Styles</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<table class="remix">
<tr><td>Item One</td><td>Subitem One</td></tr>
<tr><td>Item Two</td><td>Subitem Two</td></tr>
@seantimm
seantimm / content.html
Created March 20, 2012 21:41
HTML5 Semantics
<!DOCTYPE html>
<html>
<head>
<title>Semantics</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<article>
<header>
<h1>Semantics is meaning!</h1>
@seantimm
seantimm / content.html
Created March 21, 2012 00:10
Box Model
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title>Box Model</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="box">
<p id="border">BORDER</p>
@seantimm
seantimm / content.html
Created March 21, 2012 00:40
Box Sizing
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title>Box Sizing</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="box content">
<div>content box</div>
@seantimm
seantimm / content.html
Created March 21, 2012 03:42
Vertical Margins
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title>Vertical Margins</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="box padding">
<div class="one">padding</div>
@seantimm
seantimm / content.html
Created March 22, 2012 04:48
Static Positioning
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title>Static Positioning</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="div1">div1
<div id="div1a">div1a</div>
@seantimm
seantimm / content.html
Created March 22, 2012 04:50
Relative Positioning
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title>Relative Positioning</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="div1">div1
<div id="div1a">div1a - left: 2em</div>
@seantimm
seantimm / content.html
Created March 22, 2012 04:51
Absolute Positioning
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title>Static Positioning</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="div1">div1
<div id="div1a">div1a</div>
@seantimm
seantimm / content.html
Created March 22, 2012 04:53
Selectors
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title>Static Positioning</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body class="element">
<ul>
<li data-selector="element" class="selected">h2</li>