I'm having a few problems with some css/html code. The code isn't looking to bad in firefox(although it needs moving up the page a bit) but in internet explorer it looks very silly.
I think i have mucked up the divs somewhere but can't find it for the life of me. Any help will be much appreciated.
css
/* CSS Document */
body {
background-image: url(graphics/sect-car-background.gif);
}
#nav {
float: left;
margin: 0px;
border: 0px;
width: 15%;
}
#content2 {
float: left;
margin: 16%;
border: 0px ;
width: 50%;
display: inline;
}
/* everything above is for colums */
img {border: 1px solid; color:#000000 }
/* puts a black border round the images */
p {font:"Trebuchet MS", Verdana, Arial; size:12px}
/*P{margin: 0px 90px 0px 100px; }*/
a:link{font-family:"Trebuchet MS", Verdana, Arial; size:12px color:#F5C0F7; text-decoration:none;} a:visited{font-family:"Trebuchet MS", Verdana, Arial; size:12px color:#C00099; text-decoration:none;}
a:hover{font-family:"Trebuchet MS", Verdana, Arial; size:12px color:#C00099; text-decoration:none; cursor:pointer}
and now the html.
<!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" />
<title>H&R Vehicle Hire</title>
<link rel="stylesheet" type="text/css" href="hrcars.css"/>
</head>
<body>
<div id="nav">
<a href="home.html"><img src="graphics/logo copy.jpg" alt="H&R Vehicle Hire Logo" border="0" /></a>
<img src="graphics/nav-bar-copy150.jpg" width="195" /></div>
</div>
<div id="content2">
<p><img src="graphics/navbarfinal copy.jpg" alt="top naviagtion bar" width="650" height="185" border="0" usemap="#Map" />
<map name="Map" id="Map"><area shape="rect" coords="3,-1,215,186" href="weddings.html" />
<area shape="rect" coords="215,2,419,180" href="limo.html" />
<area shape="rect" coords="418,-1,649,187" href="classics.html" />
</map></p>
<p><img src="graphics/welcome.gif" alt="Welcome" width="106" height="30" style="border:0px;/></p>
<p> </p>
<p>
<map name="Map" id="Map">
<area shape="rect" coords="1,1,220,186" href="weddings.html" />
</p>
<p>Welcome To H&R Vehicle Hire. Weather you require a vehicle for a wedding a night out on the town are merely feel like driving a classic car for the day we are sure to have the right vehicle for you. With over 20 years experience in the idustry you can be sure that all our vehicle are of a high standard be it a steam powered vehicle or one of our state of the art limosuines.</p>
<p> </p>
<table width="568" border="0" align="center">
<tr>
<td width="202"><img src="graphics/carrige200px.jpg" alt="One of the carriges availible for hire from h&R vehicle hire" width="200" height="132" /></td>
<td width="150"><div align="center"></div></td>
<td width="202"><img src="graphics/limo200px.jpg" alt="one of the limos availible to hire" width="200" height="126" /></td>
</tr>
</table>
<p align="center"> </p>
<p align="center"> </p>
<p>
<area shape="rect" coords="211,-1,421,185" href="limo.html" />
<area shape="rect" coords="421,2,650,185" href="classics.html" />
</map>
</p>
</div>
</body>
</html>