It's more than an issue. Under the Disability Discrimination Act commercial websites/intranets in the uk are required to make “reasonable adjustments” to ensure their websites accommodate all users regardless of ability, disability.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"/>
<meta name="description" content=""/>
<link rel="shortcut icon" href="img/favicon.ico" />
<link rel="stylesheet" type="text/css" href="stylesheet.css" />
<title>Test for Red & White</title>
</head>
<body>
<div id="container">
<h1>Red & White Testing Testing</h1>
<ul id="navigation">
<li><a href="/">Home</a></li>
<li><a href="/>About</a></li>
<li><a href="/">Contact</a></li>
<li><a href="/">Links</a></li>
</ul>
<div id="content">
<p>hello, usually i'd put in some lorem ipsum but I thought I'd help you out and write this instead</p>
<p>From top to bottom in this html document there is:</p>
<ul>
<li>Doctype - needed so that browsers can do stuff</li>
<li>all the header stuff - type, description (the bit under the title in google etc), favicon & link to stylesheet</li>
<li>body - this is where you'd set the default padding, margin, font and background colour (no widths here)</li>
<li>container - this is where you'd put the whole website centered, the content background colour etc.</li>
<li>the h1 - this is the header</li>
<li>navigation - a 'ul' is an unorderd list, just like this one, naming it means you can specifically edit it up</li>
<li>the li elements - there are each individual list point</li>
<li>main content and the sidebar divs are for having 2 columns</li>
</ul>
<p>There's also the footer but that's straight forward, I'll put comments on the CSS file too</p>
</div>
<div id="sidebar">
<p>*IMAGE GOES HERE USING THIS : < img src="image destination.jpg" alt="name the image" /> job done (no spaces)</p>
</div>
<div id="footer"
<p>copyright moi</p>
</div>
</div>
</body>
</html>body {
padding: 0; /*makes sure all browsers have same padding*/
margin: 0 auto; /*same for margin*/
color: #222; /*close to black font colour*/
font: 0.8em arial, Helvetica, sans-serif; /*the font, em is the size, like pt but it can be scaled up*/
background: #ff0; /*yellow*/
}
#container {
width: 800px;
margin: 0 auto; /*this centres the whole website*/
padding: 0;
background: #fff;
}
h1 {
padding: 10px 0; /*padding on the top and bottom but none on the sides*/
margin: 0;
text-align: center;
}
#navigation, #navigation a{
margin: 0 auto; /*centered again*/
padding: 10px 20px;
text-align: center;
background: #222;
color: #fff;
}
#navigation a:hover {
color: #ff0;
}
#navigation li {
display: inline;
list-style-type: none; /*no bullet points for this list*/
}
#content {
padding: 0px 20px;
width: 450px;
float: left;
}
#sidebar {
width: 275px;
margin-left: 10px;
float: left; /*it's still floated left but it works lol*/
background: #ddd;
}
#footer {
clear: both; /*so it goes below the floated things above*/
text-align: center;
padding: 10px 10px;
color: #fff;
background: #222;
}Red & White, I've just made this dead quick, steal the first bit and call it 'index.html'
snip code
tombrooks @ live .com if you want to add me on msn to talk about it, i hope it makes sense after reading www.htmldog.com and the 456berea street link i provided before,
