gpt4 book ai didi

html - 如何将 div 与我的导航栏对齐?

转载 作者:搜寻专家 更新时间:2023-10-31 23:16:00 24 4
gpt4 key购买 nike

我有一个带有导航栏和 4 个 div 的布局。第一个 div 由导航栏裁剪。有人知道我能做什么吗?

<body>
<div id="app" class="flex-container">
<nav class="navbar default-layout p-0 fixed-top d-flex flex-row" style="height: 63px;">
<select id="region" onchange="initProcess();" style="position:absolute;background:#eaeaea;">
</select>
<div style="width: calc(100% - 74px); padding-left: 74px; left: 0; text-align: center; color: #fff">
<img src="images/co-logo.png" style="width: 100px; margin-top: -6px">
<h4>Dashboards</h4>
</div>
<div class="navbar-menu-wrapper d-flex align-items-right">
<button class="navbar-toggler navbar-toggler-right d-lg-none align-self-right" type="button" data-toggle="offcanvas">
<span class="mdi mdi-menu"></span>
</button>
</div>
</nav>
<div class="flex-item" style="background-color:red"></div>
<div class="flex-item" style="background-color:blue"></div>
<div class="flex-item" style="background-color:yellow"></div>
<div class="flex-item" style="background-color:grey"></div>
</div>
</body>

enter image description here

最佳答案

您可以轻松地添加等于导航栏高度的 padding-top css 属性。在你的情况下它将是:

.flex-container {
padding-top: 63px;
}

关于html - 如何将 div 与我的导航栏对齐?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56062374/

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