On my website
www.davies5.co.uk
The borders on the page stop half way down. Why does it do this?
www.davies5.co.uk
The borders on the page stop half way down. Why does it do this?
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Davies5 </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="description" content="A brief (160 character, including spaces) description of the current page goes here." />
<meta name="keywords" content="keywords, go, here, only, once, page, content, has, been, finished" />
<link rel="stylesheet" type="text/css" href="screen.css" media="screen,projection" />
</head>
<body>
<div id="container">
<div id="header">
<img src="images/banner.png" width="750" height="200"/>
</div>
<ul id="menu">
<li><a href="index.htm">Home</a></li>
<li><a href="rob.htm">Rob</a></li>
<li><a href="nicky.htm">Nicky</a></li>
<li><a href="ben.htm">Ben</a></li>
<li><a href="thomas.htm">Thomas</a></li>
<li><a href="amy.htm">Amy</a></li>
</ul>
<div id="content">
<div class="wrapper">
<h1>Welcome to Davies5</h1>
<p>Here you can find out about the Davies Family!</p>
</div>
</div>
<div id="footer">
<em>Copyright © ; 2007, Ben Davies.</em>
</div>
</div>
</body>
</html>
Code:
html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul,
dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object,
a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span,
strong, sub, sup, tt, var {
margin: 0;
padding: 0;
}
body {
background: #FFF;
color: #000;
font: normal 85%/140% tahoma, verdana, arial, helvetica, sans-serif;
letter-spacing: 1px;
}
h1, h2, h3, h4, h5, h6 {
font-family: tahoma, garamond, times, serif;
font-weight: bold;
}
h1 {
font-size: 1.75em;
line-height: 1.8em;
}
h2 {
font-size: 1.5em;
line-height: 1.55em;
}
h3 {
font-size: 1.05em;
line-height: 1.1em;
}
h4 {
font-size: 0.95em;
line-height: 1em;
}
h5 {
font-size: 0.85em;
line-height: 0.9em;
}
h6 {
font-size: 0.75em;
line-height: 0.8em;
}
img {
border: 0; /* fixes firefox bug */
display: block;
}
#container {
background: #285a97 url("images/nav.png") top left repeat-y;
color: #FFF;
margin: 0 auto;
width: 750px;
}
#header {
height: 200px;
}
#menu {
float: left;
list-style: none;
width: 200px;
}
#menu li {
float: left;
width: 200px;
}
#menu a {
background: transparent;
color: #FFF;
display: block;
font: 20px/20px georgia, helvetica, sans-serif;
height: 1%;
margin-right: 20px;
padding: 8px 0;
text-decoration: none;
text-indent: 30px;
text-align: left;
}
#menu a:hover {
color: #FFD700;
}
#content {
background: #FFF;
color: #000;
margin-left: 200px;
min-height: 500px;
}
* html #content {
height: 500px; /* for ie */
}
#content .wrapper {
border-right: 1px solid #000;
border-left: 1px dotted #000;
border-top: 1px dotted #000;
padding: 1em;
}
#content p {
margin: 0.5em 0;
}
#footer {
background: #FFF;
clear: left;
color: #000;
padding-top: 16px;
text-align: center;
border-top: 1px solid #000;
}
#footer em {
border-top: 2px solid #000;
display: block;
font: normal 100%/140% tahoma, helvetica, sans-serif;
margin: 0 auto;
padding: 0.5em 3em;
width: 24em; /* DO NOT CHANGE THIS VALUE */
}