Menu
Another ie problemo…I have unwanted horizontal space around my image map (in IE of course) and can’t for the life of me get rid of it…but I know someone here can…please help a frustrated fellow ie hater.
My code validates…dontcha love the green?!
CSS here:
[QUOTE]
* {margin:0; padding:0; border:none;}
body {background-color:#94a8be;}
.container {width:960px;
background-color:#002c5d;
margin-right:auto;
margin-left:auto;}
.header {background-image:url(‘header.jpg’);
height:171px;}
.menu {width:960px;
height:50px;}
.content {background-image:url(‘homebg.gif’);
width:960px;
height:477px;
clear: both;}
img {border:0;
margin:0;
padding:0;}
HTML here:
[QUOTE]
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
“
<html xmlns=”
<head><title>Legacy Preparatory Academy</title>
<link rel=”stylesheet” type=”text/css” href=”lpa.css” />
<script type=”text/javascript” language=”javascript” src=”loadimages.js”></script>
</head>
<body>
<div class=”container”>
<div class=”header”></div>
<div class=”menu”>
<!– Begin Navigation –>
<a href=”index.html” onmouseover=”mhome.src=’mhomeon.gif'”
onmouseout=”mhome.src=’mhome.gif'”>
<img src=”mhome.gif” name=”mhome” alt=”Legacy Preparatory Academy Homepage” width=”120″ height=”50″ align=”left” /></a>
<a href=”academy.html” onmouseover=”macademy.src=’macademyon.gif'”
onmouseout=”macademy.src=’macademy.gif'”>
<img src=”macademy.gif” name=”macademy” width=”120″ height=”50″ border=”0″ alt=”The Academy” align=”left” /></a>
<a href=”academics.html” onmouseover=”macademics.src=’macademicson.gif'”
onmouseout=”macademics.src=’macademics.gif'”>
<img src=”macademics.gif” name=”macademics” width=”120″ height=”50″ border=”0″ alt=”Academics” align=”left” /></a>
<a href=”enrollment.html” onmouseover=”menrollment.src=’menrollmenton.gif'”
onmouseout=”menrollment.src=’menrollment.gif'”>
<img src=”menrollment.gif” name=”menrollment” width=”120″ height=”50″ border=”0″ alt=”Enrollment” align=”left” /></a>
<a href=”students.html” onmouseover=”mstudents.src=’mstudentson.gif'”
onmouseout=”mstudents.src=’mstudents.gif'”>
<img src=”mstudents.gif” name=”mstudents” width=”120″ height=”50″ border=”0″ alt=”Legacy Students and Parents” align=”left” /></a>
<a href=”builders.html” onmouseover=”mbuilders.src=’mbuilderson.gif'”
onmouseout=”mbuilders.src=’mbuilders.gif'”>
<img src=”mbuilders.gif” name=”mbuilders” width=”120″ height=”50″ border=”0″ alt=”Builders” align=”left” /></a>
<a href=”staff.html” onmouseover=”mstafftools.src=’mstafftoolson.gif'”
onmouseout=”mstafftools.src=’mstafftools.gif'”>
<img src=”mstafftools.gif” name=”mstafftools” width=”120″ height=”50″ border=”0″ alt=”LPA Staff Tools” align=”left” /></a>
<a href=”contact.html” onmouseover=”mcontact.src=’mcontacton.gif'”
onmouseout=”mcontact.src=’mcontact.gif'”>
<img src=”mcontact.gif” name=”mcontact” width=”120″ height=”50″ border=”0″ alt=”Legacy Contacts” align=”left” /></a>
<!– End Navigation –>
</div>
<img src=”highbluebar.jpg” width=”960″ height=”81″ alt=” ” />
<img name=”clicks0″ src=”clicks.jpg” width=”960″ height=”270″ border=”0″ usemap=”#clicks” alt=”” />
<map name=”clicks” id=”clicks”>
<area shape=”poly” coords=”40,75,197,68,206,246,48,252″ href=”announcements.html” alt=”LPA Announcements” />
<area shape=”poly” coords=”216,181,374,195,388,18,229,6″ href=”needs.html” alt=”Volunteer Needs” />
<area shape=”poly” coords=”408,264,396,85,555,77,566,254″ href=”report.html” alt=”Report Volunteer Hours” />
<area shape=”poly” coords=”741,206,583,199,591,21,752,28″ href=”runiversity” alt=”Reading University” />
<area shape=”poly” coords=”778,248,761,71,918,56,937,237″ alt=”” />
</map>
<img src=”lowbluebar.jpg” width=”960″ height=”126″ alt=” ” />
</div>
</body>
</html>
See anything?
Thanks, Missy