Как добавить CSS в элемент розетки маршрутизатора

#html #css #angular #router-outlet

#HTML #CSS #угловой #маршрутизатор-розетка

Вопрос:

У меня есть код, который выглядит так:

 lt;sectiongt;  lt;div style="height: 100%; max-width: 10%; background-color: deepskyblue;"gt;my contentlt;/divgt;  lt;router-outlet style="height: 100%; min-width: 90%; background-color: gold;"gt;lt;/router-outletgt;  lt;/sectiongt;  

Я хочу, чтобы div работал как боковая панель, а розетка маршрутизатора занимала оставшиеся 90% пространства. Но в конечном итоге происходит то, что содержимое, отображаемое из розетки маршрутизатора, помещается под div, а не рядом с ним. Также похоже, что CSS не применяется к розетке маршрутизатора, так как цвет фона не меняется. Есть ли какой-нибудь способ заставить CSS вносить изменения в эту розетку маршрутизатора?

Комментарии:

1. Это, вероятно, потому, что по умолчанию дивы имеют display:block . Применить display: flex к section элементу

Ответ №1:

простое решение состоит в том, чтобы просто поместить розетку маршрутизатора в стиль div.

 lt;sectiongt;  lt;div style="height: 100%; max-width: 10%; background-color: deepskyblue;"gt;my contentlt;/divgt;  lt;div style="height: 100%; min-width: 90%; background-color: gold;"gt;  lt;router-outlet gt;lt;/router-outletgt;  lt;/divgt;  lt;/sectiongt;