#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;