Как убрать пустое пространство в навигации?

Question

[Alekosh Akhosh]

.container {
    max-width: 1440px;
    margin: 0 auto;
}
.wrapper {
    
}
.center {
    display: flex;
    align-items: center;
    justify-content: center;
}
.nav {
    position: absolute;
    z-index: 50;
    width: 100%;
}
.nav__row {
    margin-top: 45px;
    display: flex;
    justify-content: space-between;
}
.nav__logo {
    display: flex;
    color: white;
    font-size: 18px;
    font-weight: 900;
    cursor: pointer;
}
.nav__logo:hover{
    color: blue;
    transition: 0.5s;
}
.nav__logo img {
    margin-right: 17px;
}
.nav__menu {
    /* background-color: red; */
    display: flex;
    flex-flow: row wrap;
}
.list__menu {
    display: flex;
    margin: 0;
    padding: 0;
}
.link__menu:hover{
    color: blue;
    transition: 0.5s;
}
.btn {
    width: 154px;
    height: 52px;
    background: white;
    border: none;
    border-radius: 50px;
    font-weight: bold;
    font-size: 15px;
    letter-spacing: 4.2px;
    cursor: pointer;
}

.list__menu li {
    display: inline-block;
    margin-right: 51px;
}
.list__menu li a {
    display: inline-block;
    color: white;
    text-decoration: none;
    padding: 10px;
}

<div class="nav">
                <div class="container">
                    <div class="nav__row">
                        <div class="nav__logo center">
                            <img src="img/graph.svg" alt="logo">
                            <h2>SEO-Xpert</h2>
                        </div>

                        <div class="nav__menu">
                            <ul class="list__menu center">
                                <li class="item__menu"><a href="#" class="link__menu">Products</a></li>
                                <li class="item__menu"><a href="#" class="link__menu">Services</a></li>
                                <li class="item__menu"><a href="#" class="link__menu">Features</a></li>
                                <li class="item__menu"><a href="#" class="link__menu">Plans & Pricing</a></li>
                                <li class="item__menu"><a href="#" class="link__menu">Sign in</a></li>
                            </ul>
                            <button class="btn">SIGN UP</button>
                        </div>
                    </div>
                </div>
            </div>

Comments

[Сергей delphinpro]

Уважаемый автор, Brasileiro в своем ответе вам намекает, что нужно код показывать, а не (только) картинки

Answer 1

[Стефан]

Размер контейнера уменьшите

Answer 2

[Максим]

в фотошопе сотрите .... научить как ластиком пользоваться ?

Answer 3

[ForSureN1]

Посмею предположить что у родителя задано свойство justify-content: space-between, что позволяет разместить элементы на максимальное расстояние друг от друга к краю контейнера, смените данное свойство на flex-start, и тогда они все будут прижаты друг к другу