请允许我说我是 HTML/CSS 的新手,所以请原谅我非常草率的代码。基本上,我想要的只是一个标题,其中包含我的名字,然后是右上角的导航栏。但是当我调整窗口大小时,导航栏卡在右上角并且会与我的标题重叠。我只想让它留在原地!
我不确定这些信息是否足够,但我会将我的 CSS 代码放在下面。我已经尝试了一个多小时来让它从左上角调整大小。我试过 position:fixed/right:0px 但没有任何反应。如果你们能提供帮助,我将永远感激不已。
div#wrapper {
width: 98%;
margin: auto;
}
div.header {
background-color:black;
height: 80px;
width:100%;
position:fixed;
}
div.menu {
width:600px;
height:100px;
position:absolute;
right:0px;
margin-right:10px;
}
div.menu p {
display:inline-block;
float:right;
margin-top:0px;
}
div.menu a {
text-decoration: none;
display:block;
width: 100px;
padding: 30px 10px 29px 10px;
text-align:center;
margin-left: -5px;
color: black;
background-color:white;
font-family: Trajan Pro;
border-left: 1px solid black;
border-right: 1px solid black;
font-size:16px;
}
提前致谢!
最佳答案
我的理解是这样的: 您想要调整窗口大小,但不希望调整导航栏的大小。如果这就是您要问的,您应该做的很简单。
你现在的亲子关系是这样的(如果我没理解错的话)
<div id="wrapper">
<div id="menu"></div>
<div id="navigationbar"></div>
</div>
你要的是这个:
<div id="wrapper">
<div id="menu"></div>
</div>
<div id="navigationbar"></div>
这样您的导航栏 div 就不会调整大小或位置。让它卡在右上角是你需要的 css 代码:
.navigationbar{position:absolute; top:0px; right:0px;}
如果这不能解决您的问题,请说明您如何调整大小或在此处分享链接,以便我们更容易理解。
关于HTML/CSS - 减小窗口大小但导航菜单停留在屏幕右上角,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21157623/