gpt4 book ai didi

html - 将 DIV 定位在正确的位置

转载 作者:太空宇宙 更新时间:2023-11-04 14:46:58 25 4
gpt4 key购买 nike

我是 CSS 的新手,最近一直在尝试将 DIV 定位在我希望的位置,但一些属性(如 float 和边距)让我感到困惑。在下图中,我试图将白色 div 放在 Logo 的右侧。

由于我还不能在帖子上发布图片,所以我上传了 here

HTML :

<body>

<header>
<div class="header">
<div class="logo">
<img src="images/logo.png" />
</div>

<nav>
<div class="navigation">

</div>
</nav>
</div>

</header>

</body>

样式:

.header {
max-width:1200px;
min-width:200px;
height:170px;
margin:0 auto;
margin-top:10px;
background-color:rgba(0, 0, 0, 0.5);
border-radius:3px;

}

.logo {
width:230px;
}

.logo img {
margin-left:20px;
margin-top:31px;
border-right:solid #FFF 1px;
padding-right:33px;
height:auto;
width:auto;

}


.navigation {
width:500px;
height:100px;
margin-left:200px;
background-color:#FFF;
position:fixed;


}

最佳答案

.navigationposition:fixed;改为position:inline-block;并添加 margin-top 使它们根据每个高度垂直排列

或者你可以float:left;两者

关于html - 将 DIV 定位在正确的位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17786971/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com