CSS appears to hide dynamic links on images except for the last one

[MattLauder]

Im rebuilding my website and have decided to make the dynamic images for my main photography gallery be layed out using div tags and css.

 

I can get the images to load in and layout correctly but for some reason the links on the images only work on the last loaded in image. I check the code on the page and all the links are there but only the last one is active.

 

The code worked when it was all wrapped in table tags.

 

This is the css code I am using for this section is:

 

#maincontent{width:1000px;margin:0 auto;padding:0 20px}

 

#maingallery{height:382px;position:relative;width:1000px;text-align:center;margin-top:15px}

#maingallery #text{position:absolute;top:50px}

.gallery_item {float:left; margin: 20px 0 0 0; width: 200px; height: 67; padding: 0 10px 0 10px}

.gallery_item .p {padding: 10px; font-size:12px}

.gallery_item a:hover, a:active { display : block; border : none; }

 

Any help would be greatly appreciated. When I turn off the css for the divs the links are active, but obviously no styling. I'm missing something.

 

Thanks

 

Matt

[haku]

Links cannot be disabled using CSS.

 

Show us the relevant HTML as well. Or a link to the site, which would be the most preferable.

[MattLauder]

This is the page code:

   

<div id="maingallery">

<div class="gallery_item">

<p><a href="gallery.php?category=<?=$category?>"><img src="http://www.australianstockimages.com.au/images/photos/<?=$imghome?>" width="200" height="67" alt=""></a></p>

<p><?=$category?></p>

</div>

   

    <?php

          if ($count == 4) {

            echo "</tr>\n<tr>\n";

    $count = 0;   

          }

    $count++;

}

          ?>

 

</div>

[haku]

No PHP in the CSS section please. Post the HTML output of your script, not the script itself. Make sure you clean the HTML up first, and use code tags around your code (use the # button above the text area you type your replies into).