我得到了這個(gè)所說(shuō)的響應(yīng)式網(wǎng)格，我希望導(dǎo)航占據(jù)第一行，我設(shè)法實(shí)現(xiàn)了這一點(diǎn)，但是導(dǎo)航的高度變成了頁(yè)面的一半，我已經(jīng)設(shè)法根據(jù)列表最初的高度弄清楚網(wǎng)格分為兩行，該行似乎沒有采用列表的新高度。導(dǎo)航欄下方有很多空白區(qū)域。我實(shí)際上希望以下項(xiàng)目出現(xiàn)在它的正下方，沒有多余的空間順便說(shuō)一句，如果不知道位置，該怎么辦HTML： <div class="container">        <nav>            <header>                <h3>BestBook INC</h3>            </header>            <ul>                <li><a href="#">Home</a></li>                <li><a href="#">About</a></li>                <li><a href="#">Services</a></li>                <li><a href="#">Contact</a></li>                <li><a href="#">Login <i class="fas fa-user fa-lg"></i></a>                </li>                <li class="hide">                    <i class="fas fa-user-cog fa-lg"></i>                </li>                <li><a href="#">register <i class="fas fa-user-plus fa-lg"></i></a>                </li>                <li><a href="#">Log Out <i class="fas fa-sign-out-alt fa-lg "></i></a>                </li>                <li class="cart">                    <i class="fas fa-shopping-cart fa-3x"></i>                </li>            </ul>        </nav>CSS：.container{    height: 100vh;    width: 100vw;    display: grid;    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));    grid-gap: 1rem;}nav{    grid-column: 1/-1}nav ul{    display: grid;    list-style: none;    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));    grid-gap: 1rem;}nav a{    background-color: var(--primary);    text-decoration: none;    display: block;    text-align: center;    color:var(--dark);    padding: 0.48rem;    font-size: 1.1rem;    box-shadow: var(--shadow);}