I have normal thumbnails that will link to an image, however if I have them the right small size they won't link until they get to a certain position in the page(horizontally). I have tried a few things but I have no idea why they won't work. This is my code:
The link in question is
Code:
<a href="http://www.rainstormphotography.co.uk"><img src="images/partyimage1.jpg"></a>
It works fine in any other div but the content one.
CSS
Code:
body {
margin: 0;
padding: 0;
background: #ECA205 url(images/stars.jpg) top left repeat-x;
}
img {border: none;}
a {text-decoration: none;}
#wrap {
margin: 0 auto;
width: 595px;
background: url(images/container_bg.gif) top left repeat-y;
padding: 0 20px;
}
#header {
position: relative;
height: 159pt;
}
#header h1 {
position: absolute;
top: 5px;
left: -76px;
height: 508px;
width: 298px;
background: url(images/snake.gif) top left no-repeat;
text-indent: -9999px;
margin: 0;
}
#header p {
text-align: right;
margin: 0;
padding: 20px 0;
color: red;
font-size: 10pt;
}
ul {
margin: 15px 0 0 0;
padding: 0;
list-style: none;
float: right;
}
li {float: left;}
li a {
display: block;
height: 27px;
background: top left no-repeat;
text-indent: -9999px;
}
.info {background-image: url(images/info.gif);}
.party {background-image: url(images/party.gif);}
.price {background-image: url(images/price.gif);}
.contact {background-image: url(images/contact.gif);}
.info, .contact {width: 84px;}
.party, .price {width: 84px;}
#content {
clear: both;
background: url(images/content_bg.jpg) top center no-repeat;
border-top: 1px solid #FFF; /* needed to make background to align to absolute top of content div */
padding: 30px 0 0 55px;
height: 330px;
}
#content div {
height: 290px;
width: 475px;
overflow: auto;
font-size: 11pt;
font-family: arial, times new roman;
color: white;
}
#content p {margin: 10px;}
#footer {
margin: 0 auto;
width: 500px;
padding: 0 0px;
}
HTML
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Kiddies Kingdom - Information</title>
<link rel="stylesheet" type="text/css" href="style.css">
<meta name="author"
content="Becka Dawson" />
<meta http-equiv="content-type"
content="text/html; charset=uk-ansi" />
</head>
<body>
<div id="wrap">
<div id="header">
<h1>Kiddie’s Kingdom - Information</h1>
<p>
Cross Street Mill // Cross Street<br>
Leek // Staffs // ST 13 6BL<br>
T: (01538 382333)
</p>
<ul id="links">
<li class="info"><a href="info.html">Information</a></li>
<li class="party"><a href="party.html">Party Menu</a></li>
<li class="price"><a href="price.html">Prices</a></li>
<li class="contact"><a href="contact.html">Contact</a></li>
</ul>
</div>
<div id="content">
<div>
<p>Bring your children for a fun filled visit to Leek's Kiddies Kingdom indoor</p>
<a href="http://www.rainstormphotography.co.uk"><img src="images/partyimage1.jpg"></a>
<p>Perfect for children's parties. A two hour party and a choice of hot or cold party food with a lucky bag for each child to take home afterwards BOOK NOW! We also cater for exclusive children's party bookings - hire the room between 7.00 - 9.00pm - Ask for details.</p>
<p>Whilst the children have fun, you can sit, relax and enjoy a drink or snack from out well stocked cafe.</p>
<p>Children Must be supervised by a parent or guardian at all times, socks must be worn, shoes left at reception. Maximum Height 140 cm</p>
<p>We are currently taking children between the ages of 1-9 years old ONLY.</p>
</div>
</div>
<div id="footer">
<a href="http://www.rainstormphotography.co.uk"><img src="images/rainstorm.gif"></a>
</div>
</div>
</body>
</html>
Before you post, read our: 
Glad it's not stupidly complicated 
