Могу ли я переназначить свойства window.screen на div?

Question

Я хочу создать расширение Chrome, которое внедряется в каждую страницу и загружается перед визуализацией страницы, оно добавляет заголовок и боковые рамки и отображает страницу нормально, но внутри области содержимого заголовка ... любой CSS, использующий положение:абсолютные, верхние, левые, правые и т. д. будут ссылаться на область содержимого, а не на фактический экран ...

Я знаю разрешения манифеста и пробовал просто добавить тело innerHTML, но, конечно, это неt переопределяет абсолютные позиции всех других элементов, и было бы неправильно модифицировать css каждого элемента вручную после его рендеринга ...

          function containerStyles() {
            return `
              <style>
                *{margin:0;}
                #container1{
                  height: 100%;
                  width: 100%;
                  border: 1px solid green;
                  overflow: hidden;
                }

                #container2{
                  width: 100%;
                  height: 99%;
                  border: 1px solid blue;
                  overflow: auto;
                  padding-right: 15px;
                }

                html, body{
                  height: 99%;
                  border: 1px solid red;
                  overflow:hidden;
                }
              </style>
            `;
          }

          function chromeDashboard() {
            return `
              asdf
            `;
          }



          var html = document.getElementsByTagName("html")[0];
          html.innerHTML = `

            ${containerStyles()}

            ${chromeDashboard()}

            <div id="container1"><div id="container2">
              ${html.innerHTML}
            </div></div>

          `;

Я ожидаю, что будут ошибки с приведенным выше кодом,просто спрашиваю, знает ли кто-нибудь, как это сделать, спасибо!