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 '<img src="images/myaccountbutton.png" width="160" height="120">';
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.