Мобильная версияМне удалось сделать выпадающее меню раскрывающийся список открывается с помощью кнопки переключения гамбургера, после открытия мне удалось сделать кнопку в форме буквы Х для выхода, я хотел бы нажать эту кнопку, чтобы закрыть раскрывающийся список, и я хотел бы сделать это только с помощью CSS, проблема в том, что это не так не выхожу, пробую :focus + но не получается, есть идеи
я стараюсь
'''
#close_menu_btn:focus + #form1 > div:nth-child(3) > header > nav.nav-box > ul { отображение: нет !важно; } '''
и
'''
#close_menu_btn:focus + f-cb { отображение: нет !важно; } '''
но не работает, есть идеи?
.label { поле: 0 40 пикселей 0 0; размер шрифта: 26 пикселей; высота строки: 22 пикселей; дисплей: нет; цвет: #433F3F; плавать: вправо; ширина: 180 пикселей; } #переключать { дисплей: нет; } /* меню */ #close_menu_btn { дисплей: нет; } @media только экран и (максимальная ширина: 1205 пикселей) { #form1 > div:nth-child(3) > header > nav.nav-box > ul { позиция: абсолютная; цвет фона: белый; минимальная ширина: 150 пикселей; коробка-тень: 5 пикселей 16 пикселей 16 пикселей 8 пикселей rgba (0,0,0,0.4); z-индекс: 1; } #close_menu_btn { дисплей: блок; курсор: указатель; размер шрифта: 28 пикселей; высота строки: 70 пикселей; цвет: серый; плавать: вправо; плавать: вправо; } .этикетка { дисплей: блок; курсор: указатель; поле: 0 40 пикселей 0 0; размер шрифта: 28 пикселей; высота строки: 70 пикселей; цвет: серый; плавать: вправо; ширина: 26 пикселей; плавать: вправо; } #toggle:checked + .f-cb { дисплей: блокировать !важно; } #close_menu_btn:focus + #form1 > div:nth-child(3) > header > nav.nav-box > ul { отображение: нет !важно; } @media только экран и (максимальная ширина: 760 пикселей) { .этикетка { поле: 0 40 пикселей 0 0; размер шрифта: 28 пикселей; высота строки: 70 пикселей; цвет: серый; плавать: вправо; ширина: 26 пикселей; плавать: вправо; } #close_menu_btn { размер шрифта: 28 пикселей; высота строки: 70 пикселей; цвет: серый; плавать: вправо; плавать: вправо; } ☰
- ✖
