уезжает div и background

здравствуйте, подскажите,куда копать,
при уменьшении окна браузера складывается/уезжает блок и задний фон (фон по задумке должен быть резиновым)
<img src="https://i.paste.pics/2M9X5.png" width="960" height="520" alt="Screenshot">

Упорно не могу загрузить скриншот!!!:1128:

 <header>

            <div class="header-content">

                телефоны

            </div>

            

           

            <nav>

              <ul  class="header-nav">

                  <li class="logo"><a  href="#" >логотип</a></li>

                  <li class="menu">

                      <a href="#">главная</a>

                      <a href="#">о компани</a>

                      <a href="#">новые поступления</a>

                      <a href="#">акции</a>

                      <a href="#">доставка и оплата</a>

                      <a href="#">контакты</a>

                     

                  </li>  

                  <li class="basket">

                      <a  href="#">корзина</a>

                  </li>

              </ul>

            </nav>

        </header>

           

header {

   

    display: flex;

    flex-direction: column;

	background-color:rgb(93,43,78); 

	background-image: linear-gradient(to left, rgb(93,43,78), rgb(8,2,50));

	

    

}

/*верхняя часть header-шапки  с телефонами */

.header-content{

    color: #fff;

    font-size: 1em;

    padding-bottom: 4em;

}

/*нижняя часть header-шапки  с меню логотипом и корзиной */

nav {

        width: 100%;

	background-color: rgb(25,25,25);

	border: 1px solid rgba(255,255,255,.5);	

      

	border-left: none;

	border-right: none;

        

}

ul.header-nav{

    display: flex;

    flex-wrap: wrap;

    

}

.header-nav li{

    list-style: none;

}

ul.header-nav li a{

    flex: 1 15%;

    text-transform: uppercase;

    text-decoration: none;

    color: #fff;

}