ナビゲーションバーの幅を短くしたいです

Question

前提・実現したいこと

ナビゲーションバーの横幅の長さを調節したいです。
Bootstrapを用いています。

該当のソースコード

<!--- Navigation --->
    <nav class="navbar navbar-expand-md navbar-dark bg-dark fixed-top">
        <a class="navbar-brand" href="index.html"><img src="img/logo1.png"></a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive">
            <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse" id="navbarResponsive">
            <ul class="navbar-nav ml-auto">
                <li class="nav-item">
                    <a class="nav-link" href="#home">Home</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#course">Course</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#portfolio">Portfolio</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#team">Team</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#contact">Contact</a>
                </li>
            </ul>
        </div>

    </nav>

.navbar {
    text-transform: uppercase;
    font-weight: 700;
    font-size: .9rem;
    letter-spacing: .1rem;
    background: rgba(0, 0, 0, .6)!important;
}

.navbar-brand img {
    height: 3rem;
}

.navbar-nav li {
    padding-right: .7rem;
}

.navbar-dark .navbar-nav .nav-link {
    color: white;
    padding-top: .8rem;
}

.navbar-dark .navbar-nav .nav-link.active,
.navbar-dark .navbar-nav .nav-link:hover {
    color: #1ebba3;
}
@media (max-width: 767px) {
    .carousel-caption h1 {
        font-size: 2.3rem;
        letter-spacing: .1rem;
        padding-bottom: .5rem;
    }
    
    .carousel-caption h3 {
        font-size: 1.2rem;
        padding-bottom: 1.1rem;
    }
    
    .btn-lg {
        font-size: 1rem;
    }

    .narrow h1 {
        font-size: 1.5rem;
    }

    p.lead {
        font-size: 1rem;
    }
}

試したこと

本当にどこに原因があるのか分からなかったので該当するhtmlとcssを貼ります。

Answer 1

こちらでいかがでしょうか?

.navbar {
  margin: 0 auto;
  max-width: 600px; /* 好きな値を設定してください。 */
}

Comments

[RyoYo]

解決しました。
ありがとうございました

Answer 2

navbarにWidthをしてしてはどうですか？