#html #css #twitter-bootstrap
Вопрос:
Я перепробовал почти все, пытался установить положение фиксированное, навигационная панель с фиксированным верхом и фиксированным верхом, но чертова навигационная панель все еще липкая. Я переделываю чью-то работу, чтобы понять, как была построена эта вещь, нет css, который также делает позицию липкой. Я также проверил несколько сообщений о переполнении стека, которые не устраняли мою проблему 🙁
Использование начальной загрузки 5.0.0-beta2
<nav class="navbar fixed-top navbar-light navbar-expand-md navigation-clean-button" style="width: 100%;">
<div class="container-fluid">
<div><a class="navbar-brand" href="#"> <img src="assets/img/logo.png?h=ab49f36f40cf5da832aa34d1c073cb5f"></a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navcol-1"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button></div>
<div class="collapse navbar-collapse" id="navcol-1">
<ul class="navbar-nav nav-right me-auto mb-2 mb-lg-0">
<li class="nav-item"><a class="nav-link active" href="https://app.gitbook.com/@nmms/s/nmms-mm-docs/" style="color: white;">Documentation</a></li>
<li class="nav-item"><a class="nav-link" href="https://discord.gg/nmms" style="color: white;">Discord</a></li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false" style="color:white;">
Aplications
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown" style="margin-top:20px;">
<li><a class="dropdown-item" href="https://docs.google.com/forms/d/e/1FAIpQLSfipqGDH-meNOEHj5UOiHTKLgOnstOu0mlu9eEm0melCSRxTw/viewform?usp=pp_url" style="color:white;">Mod application</a></li>
<li><a class="dropdown-item" href="https://docs.google.com/forms/d/e/1FAIpQLSc3WJO1W43CTi83xvm2mG34DVR9Of9Q0QSJ8YiQIL3rtk6brQ/viewform?usp=pp_url" style="color:white;">Ban appeal</a></li>
</ul>
</li>
<li class="nav-item"><a class="nav-link" href="#" style="color: white;">Boost Rewards</a></li>
<li class="nav-item"><a class="nav-link" style="color: white" href="https://app.gitbook.com/@nmms/s/nmms-mm-docs/~/drafts/-MkE8So6PSq6YGBf9nKA/tos-for-use">TOS</a></li>
<li class="nav-item"></li>
<li class="nav-item"></li>
</ul><!-- Start: Actions -->
<p class="navbar-text actions" style="/*float: right;*/"> </p><!-- End: Actions -->
</div>
</div>
</nav>
Любая помощь будет оценена по достоинству 🙂
Комментарии:
1. Удалите
fixed-top
класс из<nav>
элемента — это объясняется в документации начальной загрузки: getbootstrap.com/docs/4.0/components/navbar/#placement2. Добавьте свой собственный стиль на страницу с навигационными правилами из верхнего и нижнего колонтитулов моего пера.