Блок в компоненте родителя не видит ширины дочерних блоков выводимых внутри него

В корневом компоненте app-component расположен header с несколькими ссылками для перехода по роутам, которые выводятся тут-же ниже в router-outlet. Страницы, которые выводятся в router-outlet могут динамически расширяться по горизонтали, в зависимости от данных приходящих с сервера.

Почему при увеличении ширины блока выводимого в router-outlet, header соответственно не растягивается по ширине. Появляется горизонтальная прокрутка с выводимым блоком и над ним половина header-а. Получается, что header не реагирует на увеличение ширины блока под ним ( в нем, по факту ). Body тоже не растягивается.

UPD: Нашла решение. Обернула все блоки в app-component.html и применила стили:

  min-width: 100%;
  width: 1%;
  display: table;