有人可以帮我弄清楚为什么我的页面右侧有一个空白吗？
这让我发疯，我已经尝试了我能想到的一切。你可以在这里看到我在说什么。
当我禁用溢出或设置 max-width: 100%; 在导航或正文上，它破坏了我的粘性导航功能，我也不明白。有谁知道发生了什么？
$(function () {
$(document).scroll(function () {
var $nav = $(".nav");
$nav.toggleClass('scrolled', $(this).scrollTop() > $nav.height());
});
});header {
margin: auto;
position: relative;
text-align: center;
justify-content: center;
z-index: 222;
}
.navigation {
margin: auto;
position: relative;
}
nav, .nav {
margin: auto;
text-align: center;
justify-content: center;
}
nav {
font-family: 'Josefin Sans', sans-serif;
font-size: 11px;
text-transform: uppercase;
letter-spacing: 1.3px;
}
.nav {
margin-top: 13px;
position: fixed;
top: 0;
width: 100%;
min-height: 59px;
}
.nav.scrolled {
margin-top: 0px !important;
background: rgba(0, 0, 0, 0.59);
}
.nav li {
margin: auto;
margin-left: 8px;
margin-right: 8px;
text-align: center;
line-height: 59px;
list-style: none;
color: #ffffff;
display: inline-block;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<header>
<div class="row">
<div class="navigation">
<nav>
<ul class="nav">
<li><a class="smoothscroll" href="#home" title="">HOME</a></li>
<li><a class="smoothscroll" href="#beats" title="">BEATS</a></li>
<li><a class="smoothscroll" href="#licenses" title="">LICENSES</a></li>
<li><a class="smoothscroll" href="#videos" title="">VIDEOS</a></li>
<li><a class="smoothscroll" href="#services" title="">SERVICES</a></li>
<li><a class="smoothscroll" href="#contact" title="">CONTACT</a></li>
</ul>
</nav>
</div>
</div>
</header>好吧，我认为这与某些事情有关
".row"：我认为您需要将“.container”添加到父元素中，如有关网格系统的 bootsrap 5 文档中 // quick way to demo
$('.row').parent().addClass('container')
transform: rotate(-8deg); 在 .home-content h1本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句