当我点击小屏幕上的bootstrap navbar-toggle按钮时，它会在navbar-collapse打开时向左移动一点，并在关闭时返回中心。

<nav class="navbar navbar-expand-sm navbar-light bg-default" data-toggle="affix">
    <div class="mx-auto d-sm-flex d-block flex-sm-nowrap">
        <button class="navbar-toggler custom-toggler" type="button" data-toggle="collapse" data-target="#toggle-items" aria-expanded="false"
            aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse text-center" id="toggle-items">
            <ul class="navbar-nav">
                <li class="nav-item active">
                    <a class="nav-link" href="#">Home</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#">O Projeto</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#">Sobre Mim</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#">Blog</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#">Contato</a>
                </li>
            </ul>
        </div>
    </div>
</nav>

CSS

.nav-link {
  font-family: "Cabo Slab-Regular";
  font-size: large;
  letter-spacing: 2px;
  color: white !important;
  padding: 10px;
  padding-left: 30px !important;
  padding-right: 30px !important;
}

.nav-link:hover {
  color: #e1e1e1 !important;
}

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) { 
  .nav-link {
    font-size: inherit;
    padding: 0;
    padding-left: 0 !important;
    padding-right: 0 !important;
  } 
}