Html 导航栏故障

当我更改导航栏的分辨率时，它会出现小故障。这是我的HTML

<!--Start header-->
    <div id="header">

        <div id="nav_header">
          <ul id="list-nav">
            <a href="index.htm" id="home">Troll Happy</a>
<li><a href="iphone.htm" id="fail">iPhone Fail</a></li>
  <li><a href="forever.htm" id="alone">Forever Alone</a></li>
  <li><a href="rage.htm" id="rage">Rage Comics</a></li>
  <li><a href="derphina.htm" id="Derp">Derpina</a></li>
  <li><a href="okay.htm" id="okay">Okay face</a></li>
  <li><a href="http://forums.trollhappy.co.uk/xenforo/forum/index.php" id="forums">Forums</a></li>
        </ul>
        </div>
    </div>
<!--End header-->

你可以看到这里发生了什么

trollhappy.co.uk

正如你所看到的，如果你改变分辨率，导航栏就会变得非常故障

再次感谢各位朋友，你们的

元素被向左浮动，这意味着如果它们不能全部放在一条直线上，因为容器在水平方向上太小，它们将溢出容器

---

为了简单起见，您可能只想隐藏链接，而不是对较小的屏幕实施一些优雅的降级（只要确保它在960px宽的浏览器窗口中看起来不错）。只需应用

溢出：隐藏样式到
#导航单元标题
“分辨率”不是正确的词。我想你的意思是“视窗宽度”。谢谢你的回答。我最初尝试过，但它会切断大部分标题和徽标，如果我将其移动到#标题，它会正常工作，但我也不想这样做。你能给我一些想法，如何对我的导航栏进行优化，使它在更小的屏幕上看起来更好吗？这就是我现在的问题-谢谢！这真的很好，不过如果我测试了一个小屏幕，然后使用滚动条，黑色的导航条会切断，这是我的问题-
   you just small mistakes, it follows;
   u remove the margin-left:100px, insted  margin:0px auto; and set width:840px;
   #nav_header {
    height: 50px;
    margin: 0 auto;
    width: 840px;
   }

   ok i understand the misstake, u set the body tag then work perfectly,,,, 

   body{
       margin:-18px 0px 0px 0px;
    } 


    ok friend on small changes do this,u add the min-width:1000px;

    #header {

   background-color: #000000;
   height: 70px;
   left: 0;
   min-width: 1000px;
   position: absolute;
   right: 0;
 }

   you just small mistakes, it follows;
   u remove the margin-left:100px, insted  margin:0px auto; and set width:840px;
   #nav_header {
    height: 50px;
    margin: 0 auto;
    width: 840px;
   }

   ok i understand the misstake, u set the body tag then work perfectly,,,, 

   body{
       margin:-18px 0px 0px 0px;
    } 


    ok friend on small changes do this,u add the min-width:1000px;

    #header {

   background-color: #000000;
   height: 70px;
   left: 0;
   min-width: 1000px;
   position: absolute;
   right: 0;
 }