내 웹 사이트의 헤더 부분에서 내 링크가 작동하지 않습니까?

Question

좋아,이 문제를 해결하기 위해 내가 생각할 수있는 모든 것을 시도했다 ... 내 사이트의 상단에 링크가 작동하지 않습니다.

다른 곳에서도 괜찮습니다.

여기 내 HTML입니다 :

<div id="header" class="header1" align="center"> 
</div><!--end blue header div--> 

<div class="logo" align="center"> 
<table align="center" width="800px"><tr><td width="800px" align="center"> 
<img align="middle" src="images/phwm_sc_logo.png" width="170" height="212" alt="logo" /> 
    </td></tr></table> 
    <!--must be same width as navigation "header2 div"--> 
</div> 
<!--end logo div--> 

<div id="header" class="header2" align="center"> 
<table width="800px" height="80px" style="padding-top:10px"> <!--height of table must match height of div "header 2" --> 
<tr> 
<td width="138"><h1><a href="index.html">[ HOME ]</a></h1></td> 
<td width="149"><h1><a href="index.html">[ TEAMS ]</a></h1></td> 
<td width="220"><h1></td> 
<td width="137"><h1><a href="index.html">[ STAFF ]</a></h1></td> 
<td width="132"><h1>[ GALLERY ]</h1></td> 

</tr> 
</table> 
</div><!--end red navigation header div--> 

여기 내 외부 CSS입니다 :

a.ex1:link { 
color:#666335; 
text-decoration:none 
} /* unvisited link */ 
a.ex1:visited { 
color:#666335; 
text-decoration:none 
} /* visited link */ 
a.ex1:hover { 
color:#D85D27; 
text-decoration:none 
} /* mouse over link */ 
a.ex1:active { 
color:#D85D27; 
text-decoration:none 
} /* selected link */.header1 { position:fixed; top: 0px; 
width: 100%; height:50px; 
background-color: rgba(0, 54, 103, 0.6); /* Color white with alpha 0.9*/ 
} 
.header2 { position:fixed; top:60px; 
width: 100%; height:80px; 
background-color: rgba(210, 6, 46, 0.4); /* Color white with alpha 0.9*/ 
} 

.logo {position:fixed; top: 5px; 
z-index:10; width:100%; 
} 

난 항상 HTML 및 필요한 경우 CSS 모두의 이상을 포함 할 수 있습니다 ... 도와주세요! 이 문제를 어떻게 해결합니까?

Answer 1

센터 로고가 포함 된 표가 링크 위에 겹치므로 링크를 클릭한다고 생각하면 실제로 표를 클릭하여 링크에 액세스하지 못하게합니다. 로고 컨테이너를 로고와 동일한 크기로 만들면 괜찮을 것입니다.