Use:
#headerlogo a {
display: block;
}
And remove the width:100%;
from the headerLink divs because they are overlaying your logo.
Pergunta
I am currently using two files: test.html and style.css and the logo is only partially functioning as a link. Is there any way I can fix this?
A preview of the problem can be seen here: Website Test
test.html
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<title>Mindtale</title>
</head>
<body>
<div id="headerlogo">
<a href="index.html"><img src="images/logo.png"></a>
</div>
<div id="headerlink1">
<a href="portfolio.html">Portfolio</a>
</div>
<div id="headerlink2">
<a href="contact.html">Contact</a>
</div>
<div id="headerimg"></div>
<div id="content1">
</div>
<div id="footer">
Mindtale © 2013
</div>
</div>
</body>
</html>
style.css
html {
height:100%; /* fix height to 100% for IE */
max-height:100%; /* fix height for other browsers */
background: url(images/bg.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
div#headerlogo {
z-index:0;
position:fixed;
left: 41%;
top: 24px;
}
div#headerlink1 {
z-index:2;
position:fixed;
top:50px;
left:18%;
width:100%;
color:#999;
padding: 0px;
}
div#headerlink2 {
z-index:3;
position:fixed;
top:50px;
left:78%;
width:100%;
color:#999;
padding: 0px;
}
div#headerimg {
position:fixed;
background: url(images/header.png) no-repeat center;
height: 102px;
top:0px;
left:0px;
width:100%;
padding: 0px;
}
div#content1 {
position:fixed;
width:100%;
color:#222;
top: 70px;
bottom: 0;
left: 0;
right: 0;
padding: 25px;
overflow: auto;
}
div#footer {
position:fixed;
bottom:0px;
left:0px;
width:100%;
color:#999;
background:#333;
padding: 8px;
}
Solução
Use:
#headerlogo a {
display: block;
}
And remove the width:100%;
from the headerLink divs because they are overlaying your logo.
Outras dicas
Your headerlink1
div is partially over the logo.
This makes that bit of the logo unclickable.
How to fix? Change the design - perhaps two divs for the different links - something that will not obscure the logo.