Html 导航栏缩放问题

我有一个问题，我的导航栏似乎与CSS中的.container一起缩放。现在，我是个新手，但我尝试过搞乱CSS中的值，但没用。以下是HTML和CSS的代码：

*{
边际：0px；
填充：0px；
}
身体{
字体系列：verdana；
背景图片：url（images/bg2.jpg）；
最大宽度：100%；
最大高度：自动；
背景位置：0px 100px；
背景重复：重复-x；
背景色：黑色；
背景大小：100%；
}
#标题{
背景色：#000000；
高度：100px；
宽度：100%；
}
.集装箱{
背景颜色：灰色；
宽度：960px；
高度：自动；
保证金：0自动；
颜色：rgb（200200200200）；
}
#标识区{
宽度：300px；
高度：100px；
背景图片：url（images/logo.png）；
浮动：左；
显示：块；
}
#导航区{
身高：50%；
浮动：对；
}
#导航{
列表样式：无；
利润率最高：5%；
}
#导航a{
颜色：#C8C8C8；
文字装饰：无；
宽度：75px；
高度：50px；
显示：表格单元格；
垂直对齐：中间对齐；
填充：0；
}
#李海军{
宽度：75px；
高度：50px；
浮动：左；
左边距：30px；
背景色：#252525；
边框：2件纯银；
边界半径：8px；
填充：0px；
文本对齐：居中；
显示：表格单元格；
垂直对齐：中间对齐；
}
#李导航：悬停{
背景颜色：灰色；
}
.第页{
背景色：rgba（19,19,19,0.9）；
填充：20px；
垫底：1px；
}
p{
边缘底部：20px；
}
.box1{
位置：相对位置；
宽度：300px；
高度：100px；
背景图片：url（images/logo.png）；
背景重复：无重复；
浮动：左；
}
#图像标识{
宽度：960px；
高度：324px；
背景图片：url（images/Triicell logo.png）；
背景重复：无重复；
背景位置：中心；
}

试验场地

wp_1

wp_2

wp_3

wp_4

wp_5


试验场地

您需要清除浮动

为此，您可以在

#标题

之后添加

.clear

类

.clear{
     clear:both;
}

或者在

标题中添加
.clearfix
类

#clearfix:after {
   clear: both;
   content: "";
   display: block;
}

然后你就可以轻松地管理你的
.container
宽度
50%
或任何东西

下面是html代码中的一些错误，如-

 <li>wp_1</a>
          </li>

wp\u 1


应该是这样的-

 <li>
    <a href="">wp_1</a>
 </li> 




我希望这将有助于实现您想要的目标。
嘿，谢谢您让您的问题更容易理解，问题是如果您将容器制作为50%，那么就没有更多的空间留给导航，因为#logo区域宽度太大，因此它会将导航推到下一行，如果你想让它工作，你应该减小#logo区域和/或#nav区域的宽度。我希望这有帮助。
啊。。。我知道这里出了什么问题。导航栏没有足够的空间放置在我想要的位置。你看，在导航栏旁边应该有一个徽标，但是自从移除它之后，导航栏现在就是我想要的位置，即使在缩放之后也是如此

现在唯一要做的就是找出如何缩放导航栏本身（即，使导航栏的大小根据显示的分辨率而改变），但我认为这是一场改天的战斗

感谢所有对问题做出贡献的人。我知道我的愚蠢会以某种方式战胜我。不过，谢谢。
由于#navArea嵌套在
#标题中
因此您必须从页面的自然流中删除
#navArea
，才能实现您的目标

这看起来像

#navArea {
  position: absolute;
  top: 20px;
  right: 20px;
}

请你更详细地解释一下你想要达到的目标好吗？此外，如果你删除了CSS/HTML中与当前问题不直接相关的部分，这将有助于人们回答。@Derek，通过缩放什么意思？当然可以。我希望导航栏保持其在容器顶部的位置（深灰色区域）。我会修改代码。通过缩放，我的意思是元素的大小取决于它被观看的分辨率。但我不认为导航栏需要任何缩放，这只是位置问题。这就是你想要的吗？@DerekSimmons“对不起，显然我需要10个声誉来发布多个链接。”有了10+的声誉，你可以发布链接，对吗？是的。你的答案在金钱上。我现在在回答我自己的问题时说明了这一点。非常感谢。我感谢你的帮助。