Hi I've recently been experimenting with html and have come across another problem with the layout.
I seem to have got this alright,however there seems to be a big gap between the end of the heading and the beginning of the table,basically I would like this gap closed.....the page has a margin in it with a separate list in it .which might have something to do with it....
<?xml version="1.0" encoding="utf-8"?>
<!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">
<head>
<title>apples</title>
<link rel="stylesheet" type="text/css" href="farm.css" />
</head>
<body>
<div id="navigation">
<ul>
<li>Because I've fallen in love with my computer and want to give her some HTML loving.</li>
<li>To learn HTML</li>
<li>To show off</li>
</ul>
</div>
<div class="hurry">
<div id="aaa">
<h1>Dave's Garden Shop and Nursery</h1>
</div>
<table>
<tr>
<td><a href="http://www.pageresoruce.com">About Us</a></td>
<td><a href="http://www.pageresoruce.com">Garden Guide</a></td>
<td><a href="http://www.pageresoruce.com">Events</a></td>
<td><a href="http://www.pageresoruce.com">Links</a></td>
<td><a href="http://www.pageresoruce.com">Home</a></td>
</tr>
</table>
<h1>Dealing with Garden Pest's</h1>
<div id="bbb">
<p>Is your Garden infested? Tired of battling aphids and other pests? You can find plenty of insects that help you control bad bugs in your garden,and our garden shop can order them for you .For example,did you know that the Praying Mantis is one the most useful insects to reside in your garden.</p>
</div>
<div id="redapp"><img src="gala-chimera1.jpg" width="193" height="200" alt="** RED APPLE" />
<div id="greenapp"><img src="allington20pippin.jpg" width="193" height="200" alt="GREEN APPLE" /></div>
</div>
</body>
</html>
heres the css
body {
background-color : #33cc99;
}
.hurry {
margin-left : 100px;
}
table {
width : 900px;
table-layout : fixed;
border-collapse : collapse;
}
td {
border : 1px solid #3333ff;
text-align : center;
}
#bbb {
border-right-style : dotted;
border : solid;
border-width : 2px 2px 2px 2px;
text-align : center;
border-color : #ffccff;
background-color : #00ffff;
}
#aaa {
line-height : 4.5;
font-family : Futura hv;
text-align : center;
background-image : url(Pearflower2.jpg);
background-repeat : repeat;
}
#navigation {
position : relative;
float : left;
width : 6em;
background : #ccf;
}