Firefox won't display usable link

Firefox won't disply links as usable link, only text. No problems

Page 1 of 1

2 Replies - 1429 Views - Last Post: 24 November 2009 - 04:14 PM

#1 Chemlight  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 6
  • Joined: 28-September 07

Firefox won't display usable link

Post icon  Posted 24 November 2009 - 11:59 AM

I really haven't used this forum much. I'm working on developing a portfolio site for myself, and am working on the HTML and CSS. I came across an interesting issue.

I'll provide the code, then what I expect it to do, and what it is doing.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<?php
	require("scripts/curPageURL.php");
	//require("scripts/dbconnect.php");
	$pageid = curPageURL();
	//$pagevars = mysql_query("SELECT * FROM pages WHERE pagelink LIKE '" . $pageid . "'");
	//while($row = mysql_fetch_array($pagevars)){
		//assign variables
	//}
?>
	<title>Aaron Chmelik</title>
	<link rel="stylesheet" type="text/css" href="style/style.css" />
</head>
<body>
	<div id="banner">
		<img src="images/banner_background6.png" id="bannerimg" />
		<div id="bannertext">
			<span><h1 id="bannertextleft">Aaron Chmelik<br />Web Site Design and Programming</h1></span>
			<span><h4 id="bannertextright">Quality Work<br /><br />Standards Compliance<br /><br />Your Site Done Right</h4></span>
		</div>
		<div id="links">
			
				<span id="currentpagelink" class="linknav" ><a href="index.php">About Me</a></span>
				<div id="nonpagelink" class="linknav"><a href="portfolio.php">Portfolio</a></div>
				<div id="nonpagelink" class="linknav"><a href="portfolio.php">Experience</a></div>
				<div id="nonpagelink" class="linknav"><a href="portfolio.php">Certs and Education</a></div>
				<div id="nonpagelink" class="linknav"><a href="portfolio.php">References</a></div>
				<div id="nonpagelink" class="linknav"><a href="portfolio.php">Contact Me</a></div>
			
		</div>
	</div>
</body>
</html>



and the css


#bannerimg {
	position: absolute;
	top: 1%;
	z-index: -1;	
	}
	
#bannertext{
	position: absolute;
	top: 1%;
	height: 199px;
	width: 1200px;
	color: white;
	}
	
#bannertextleft{
	padding-left: 20px;
	}

#bannertextright{
	padding-left: 1025px;
	margin-top: -100px;
	}
	
#currentpagelink {
	background: #948A54;
	border: 2px solid black;
	}
	
#nonpagelink {
	background:#a6a6a6;
	border: 2px solid #595959;
	}
	
#links {
	margin-top: 175px;
	margin-left: 111px;
	}
	
.linknav {	
	height: 30px;
	width: 145px;
	float:left;
	text-align: center;
	}

#links a {
	   color: black;
	   font-weight: bold;
	   }



Expected Result:
Layout works perfect. The links should be black, bold, and clickable.

Actual result:
No issues in IE8. The link's text is visible in FF3.5, but not clickable, and the text is not selectable.

Really not sure why it is doing this. I'm sure its something I missed. Thanks!

Aaron Chmelik

Is This A Good Question/Topic? 0
  • +

Replies To: Firefox won't display usable link

#2 CatchThi5Drift  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 25
  • Joined: 12-October 09

Re: Firefox won't display usable link

Posted 24 November 2009 - 01:42 PM

The W3C markup validator comes up with a few errors, so that'd be a good place to start looking for clues.

http://validator.w3.org
Was This Post Helpful? 0
  • +
  • -

#3 Chemlight  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 6
  • Joined: 28-September 07

Re: Firefox won't display usable link

Posted 24 November 2009 - 04:14 PM

Thanks for bringing up the W3C validator. I corrected my code and it validated, but I was still having the issue. I then copied the validation img/link, and put it in my code to see if it would work, and again, I couldn't click on the link, except for the part that extended below my banner.

So, I changed my links division to an absolute position, set it to z-index +1, and now it works. For anyone who might be interested in this issue later on, hope this helps.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1