The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Image links only clickable at very bottom
poonchy722
post May 15 2012, 11:49 PM
Post #1





Group: Members
Posts: 3
Joined: 15-May 12
Member No.: 17,120



Hello everyone,

I have created a site that has 3 links that display as clickable images. The links work perfectly in firefox, but for some reason in google chrome (and safari) they are only clickable at the very bottom of the image, in a horizontal strip that is probably only 2 or 3 pixels tall. Here is the snippet of code that sets up the links:



////////////////////////////////////////////////////////////////
// link to make picks page
echo '     <a href="user_choice.php">';
echo '<img src="images/makepicksbutton.png" width="160" height="120">';
echo '</a>   ';

////////////////////////////////////////////////////////////////
// link to game history calendar
echo '<a href="game_history_calendar.php">';
echo '<img src="images/gamehistorybutton.png" width="160" height="120">';
echo '</a>   ';

////////////////////////////////////////////////////////////////
// link to user's account page
echo '<a href="userchoice_history.php?username=';
echo $_COOKIE['username'];
echo '">';
echo '<img src="images/myaccountbutton.png" width="160" height="120">';
echo '</a>';



Note that this is all being done with php, but I thought it still belonged in the markup forum since the problem is with an <a> tag...

I apologize for any sloppiness in my code, I am by no means a professional web developer and this is just a project I am doing for myself and some friends to organize a football pool.

The links are in a table, if that matters.

I have tried setting the z-index for the links, but this doesn't seem to help anything. Also, since the links are still clickable (but only in a tiny strip at the very bottom of the image, rather than the whole image), I am assuming this isn't a z-index issue, but rather an issue with the link "size".

Everything but these links is working perfectly on the site, so if someone could help me get the links to work I would be very grateful!

Thanks a lot for your help. Let me know if you need any more information from me, or if you want me to post the entire pages code (it's a lot), etc.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post May 16 2012, 01:29 AM
Post #2


WDG Member
********

Group: Root Admin
Posts: 8,365
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



It sounds like some other element is covering most of the linked images, but without the URL (address) of a document that demonstrates the problem, it's hard to say anything specific.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
poonchy722
post May 16 2012, 11:19 PM
Post #3





Group: Members
Posts: 3
Joined: 15-May 12
Member No.: 17,120



I actually figured the problem out after an hour or so of trial and error! The problem was a div that had it's position set as relative. When I changed this it fixed the problem. Thanks!
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 28th March 2024 - 11:44 PM