Как я могу первоначально скрыть активное выпадающее мену, когда обрушивается меню «Вертикальная загрузка 5»? ⇐ Html

[Anonymous]

Я преобразовал горизонтальный навигал 5 навигации в вертикальную боковую панели. Lang-CSS PrettyPrint-Override ">

Код: Выделить всё

.page {
min-height: 100vh;
}

.site-header {
padding: 0 10px;
height: 60px;
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.05);
}

.sidebar {
box-shadow: 3px 0px 11px 0px rgba(0, 0, 0, 0.04);
width: 82px;
height: auto !important;
}

.sidebar.show {
width: 200px;
}

/* Logo Begin */
.logo-container {
min-width: 82px;
display: flex;
align-items: center;
}

.brand {
height: 60px;
display: flex;
padding-left: 5px;
align-items: center;
text-decoration: none;
}

.brand img {
display: none;
height: 30px;
width: auto;
}

/* Logo End */

/* Menu Begin */
.sidebar .brand img.collapsed {
display: inline;
}

.sidebar.show .brand img {
display: inline;
}

.sidebar.show .brand img.collapsed {
display: none;
}

.sidebar .dropdown-toggle::after {
display: none;
position: absolute;
top: 17px;
right: 15px;
content: "";
border: 0;
border-bottom: 1px solid #495057;
border-right: 1px solid #495057;
height: 6px;
width: 6px;
transform: rotate(45deg);
}

.sidebar .dropdown-toggle.show::after {
transform: rotate(225deg);
}

.sidebar .navbar-nav .nav-link {
position: relative;
text-align: center;
padding: 6px 12px;
color: #198754 !important;
}

.sidebar.show .navbar-nav .nav-link {
text-align: left;
}

.sidebar .navbar-nav .nav-link:hover,
.sidebar .navbar-nav .nav-link.active {
background: #e9ecef;
}

.sidebar .navbar-nav .nav-link .link-text {
display: none;
}

.sidebar.show .navbar-nav .nav-link .menu-icon {
padding-right: 5px;
}

.sidebar.show .navbar-nav .nav-link .link-text {
display: inline;
}

.sidebar.show .dropdown-toggle::after {
display: inline;
}

.sidebar .dropdown-menu {
border: none !important;
transform: none !important;
position: absolute !important;
left: 50px !important;
top: 10px !important;
border: 1px solid rgba(0, 0, 0, 0.04) !important;
box-shadow: 3px 0px 11px 0px rgba(0, 0, 0, 0.05);
}

.sidebar.show .dropdown-menu {
position: static !important;
width: 100%;
left: auto;
padding: 0;
box-shadow: none;
}

.sidebar .dropdown-menu .dropdown-item {
color: inherit;
}

.sidebar.show .dropdown-menu .dropdown-item {
padding-left: 40px;
}

.sidebar .dropdown-menu .dropdown-item.active,
.sidebar .dropdown-menu .dropdown-item:hover {
background: #e9ecef;
}

/* Menu End */

.main {
display: flex;
flex-direction: column;
flex: 1;
}

.content {
flex: 1;
display: flex;
flex-direction: column;
}< /code>
[*]



[url=#]
[img]https://i.sstatic.net/bmJ0DHwU.png[/img]
[img]https://i.sstatic.net/rKpG1nkZ.png[/img]
[/url]

[list]

[url=#][/i]  Now playing[/url]

[*]
[url=#]
[i][/i] Genres
[/url]


[url=#]Action[/url]

[*]
[url=#]Adventure[/url]

[*]
[url=#]Science Fiction[/url]

[/list]






Lorem ipsum dolor sit amet


Lorem, ipsum dolor sit amet consectetur adipisicing elit
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Placeat nam nobis recusandae rem aut nesciunt
officiis incidunt voluptatum dicta doloremque, tempora suscipit debitis corporis nihil, corrupti tempore
aspernatur praesentium. Dolorum.

Я сталкиваюсь с проблемой, когда я делаю A выпадающий меню , а боковая панель разбавляется : раскрывающийся меню отображается, когда на странице и я хочу, чтобы это было сбором, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу, и я хочу. Выпачающийся переключатель .
В противном случае, когда меню расширяется, все в порядке, как сейчас. /> В качестве альтернативы, когда боковая панель обрушивается, как я могу сделать выпадающую меню только тогда, когда раскрывающийся переключатель завис? < /li>
< /ol>

Подробнее здесь: https://stackoverflow.com/questions/796 ... strap-5-me