Сергей Бут

Оберните текст в блок с классом flex

<div class="flex">
    <h2>Hello</h2>
    <p>World</p>
    </div>

.flex {
    display: flex;
    flex-direction: row;
    align-items: baseline;
}

Lam Besis , хоть убей на расширении 390*444 я не вижу там display : none у child-a . Со скринов видно, что дисплей и позишн переопределяются нормально, и помоему все работает. Другое дело видите ли вы блок ,который фиксед: dicem ,высоту задаете при анимировании или как раз ее и забыли указать?Да и сорить display :block не надо, все теги <div> по дефолту имеют display :block

возможно вам подойдет и такое решение :
в любом ютюб видео подключеном через src="" можно добавить в ссылку
mute=1&
чтобы iframe выглядил так:

<iframe width="100%" height="100%" src="https://www.youtube.com/embed/CwJ4eBWalFo?rel=0&amp;mute=1&amp;start=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

где https://www.youtube.com/embed/CwJ4eBWalFo изначальная ссылка

Проблема решена. Если кому-то интересно решение :

'use strict';

var nextPage=document.getElementById("toRight");
var currentPage=document.getElementById("currentPage");
var prevPage=document.getElementById("toLeft");
var pages=document.getElementById("pages").innerHTML;
var Page;

var pageUp=function(){
     Page=currentPage.innerHTML;
     if (Page<pages){
     Page++;
     currentPage.innerHTML=Page;}
     else{
         Page=pages;
     }
    };
   var pageDown=function(){
    Page=currentPage.innerHTML;
    if (Page>1){
    Page--;
    currentPage.innerHTML=Page;
    }
    else{
    Page=1;
    }
  };

nextPage.onclick=function(){pageUp();};
prevPage.onclick=function(){pageDown();};