html - 并非所有链接都有效

Question

我正在编写网站代码，我注意到在导航栏中，有些链接有效，有些无效。

我已经意识到那个词的链接组有不同的 css 代码，如果我删除它，那么其他的将起作用，但其他的当然不会出现。我尝试了很多东西，但似乎没有任何效果。

我想要的只是一组左侧的链接和右侧的其余所有链接，当然，这是我的代码:

<!-- Create navigation bar-->
        <style>
            #TopBar{
   position:fixed;
   top:0;
   left:0;
   width:100%;
   height:40px;
   background-color:#181818;
}
            </style>         
            <div id="TopBar"></div>     
        <!-- Create Page Links -->
        <style>
        ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    color: white; 
    position: absolute; 
    font-family: sans-serif;        
    font-size: 20px;
    padding-left: 163px;      
}
        </style>
        <style>
        al {
    list-style-type: none;
    margin: 0;
    padding: 0;
    color: white; 
    position: absolute; 
    font-family: sans-serif;
    font-size: 20px;
    padding-left: 1028px;
        }
        </style>
<style>
        li {
    display: inline;
    margin: 5px;        
}
        </style>
        <style>
            a{color: #ffffff;
            text-decoration:none;   
            }
        </style>
        <ul>
  <li><a href="default.asp">Cos'è</a></li>
  <li><a href="news.asp">Chi Siamo</a></li>
</ul>
        <al>
            <li><a href="">News</a></li>
            <li><a href="">Video</a></li>
            <li><a href="">Gallery</a></li>
        </al>

希望有人能尽快帮我解决这个问题。

Answer 1

只需将你的 CSS 改成这样，

al {
  list-style-type: none;
  margin: 0;
  padding: 0;
  color: white;
  position: absolute;
  font-family: sans-serif;
  font-size: 20px;
  right: 0;
}

如您所见，padding-left:1028px; 被替换为 right:0; 。因为它导致左侧链接重叠。这就是无法点击的原因。