I’ve been working on a page where I’d like a series of rollover images to form a solid bar across the top. However, while putting it together each image seems to have about 3px of padding around it that I can’t get to go away. It’d like the images to all touch eachother without any padding.
I’m using Dreamweaver and the code is as follows:
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>
<html>
<head>
<title>Why doesnt this work?</title>
<style type=”text/css”>
#rollovers table{
position: absolute; top: 150px; left: 80px;
width: 544px;
height: 24px;
padding: 0px;
cell-spacing: 0px;
border: none;
z-index: 10;
}
</style>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″>
</head>
<body>
<div id=”rollovers”>
<table bgcolor=”#CCCCCC”><tr><td>
<img src=”images/l.gif” alt=”Leaders” name=”Image4″ width=”103″ height=”24″>
<img src=”images/m.gif” alt=”Materials” name=”Image5″ width=”130″ height=”24″>
<img src=”images/p.gif” alt=”Prepare” name=”Image6″ width=”113″ height=”24″>
<img src=”images/c.gif” alt=”Contact” name=”Image7″ width=”113″ height=”24″>
<img src=”images/h.gif” alt=”Home” name=”Image8″ width=”85″ height=”24″>
</td></tr></table></div>
</body>
</html>
You can also find the page at:
[url]www.Jacobkohlhaas.net/test/rollover.htm
Thanks for the help!