Как не растягивать картинку?

Question

[Manvel]

Почему кожа меню закрыт то картинка норм



Но когда открываю то тогда картинка растягивается



Бургер взял из бутстрап
А картинку подключил так

<header>
    <nav class="navbar navbar-expand-lg navbar-light">
        <img src="images/logo.png" class="navbar-brand">
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
      
        <div class="collapse navbar-collapse" id="navbarSupportedContent">
          <ul class="navbar-nav ml-auto mr-auto">
            <li class="nav-item">
              <a class="nav-link text-white" href="#">Главная</a>
            </li>
            <li class="nav-item">
              <a class="nav-link text-white" href="#">Курсы</a>
            </li>
            <li class="nav-item">
                <a class="nav-link text-white" href="#">Расписание</a>
              </li>
              <li class="nav-item">
                <a class="nav-link text-white" href="#">Преподаватели</a>
              </li>
              <li class="nav-item">
                <a class="nav-link text-white" href="#">Рассылка</a>
              </li>
              <li class="nav-item">
                <a class="nav-link text-white" href="#">Контакты</a>
              </li>
          </ul>

          <form class="form-inline my-2 my-lg-0">
                <button class="violet_btn">Зайти в кабинет</button>
        </form>
        </div>
      </nav>

     
        <div class="container-fluid">
            <div class="count_div">
                <div class="row">
                    <h1 class="h1_64">Первый курс по компьютерной сборке</h1>
                    <div class="col-12 col-md-8 flex_count mb-3">
                        <div class="black_count">
                            <div class="row_num">18</div>
                            <div class="row_time">Дней</div>
                        </div>

                        <div class="black_count bl_c">
                            <div class="row_num">18</div>
                            <div class="row_time">Часов</div>
                        </div>     

                        <div class="black_count bl_c">
                            <div class="row_num">18</div>
                            <div class="row_time">Минут</div>
                        </div>

                        <div class="black_count bl_c">
                            <div class="row_num">18</div>
                            <div class="row_time">Секунд</div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </header>

header{
    background-image: url(../images/main-screen__bgc.png) !important;
    background-size: 100% 100% !important;
    height: auto !important;
    width:100% !important;
}

Answer 1

[Влад]

Почему кожа меню закрыт то картинка норм

Потому что меню находится в блоке, на котором стоит фон. Можно попробовать так, но особо сильно ситуация не изменится: background-size: cover;

Answer 2

[Sergey]

Так и есть - лучше сделайте фон для правого блока, а в левого блока (меню) просто черный бекграунд