Jak umieścić wideo z You tube do innego diva, by responsywnie się zmniejszało i powiększało bez utraty wysokości video ?

Question

Jak umieścić video w środku tego ekranu (ramka wycięta w photoshopie) by podczas zmniejszania i powiększania strony ładnie się skalowało. Od razu zaznaczam, że tworzenie obramowania w postaci dopisania border-source nie działa......

---

---

     
 .box{
width:90%;
 position:relative;
  padding-bottom:56.25%;
}


video{

position: absolute;
    width:100%;
    height:100%;
   
   
}
.another_container{

background-image: url(./monitor_border.png);
background-size: 100% 100%;
width:100%;

}

---

<div class="another_container">
    <div class="box">
         <video  autoplay loop>
              <source src="videoplayback.mp4"  type="video/mp4">
          </video>

    </div>
</div>

 

Answer 1

Np tak, ramka w png wsadzona do pseudoelementu: https://jsbin.com/dakunuwaje/edit?html,css,output