Я использую плагин jquery superfish. Я пытаюсь сделать так, чтобы второе подменю было той же высоты, что и первое подменю. Я также хочу расположить второе подменю прямо под меню, как показано на скриншоте. Но я не знаю, как это сделать. Я пытался сделать родительский элемент display: contents, но если я это сделаю, все просто перестанет работать
Есть ли способ сделать так, чтобы плагин superfish был на той же высоте, что и меню?
Ответы (1)
Это можно решить, добавив сразу два css-правила.
По умолчанию все подменю (т.е. <ul>
s) абсолютно позиционированы относительно родительского элемента <li>
. Итак, чтобы расположить подменю третьего уровня по отношению к меню верхнего уровня, отключите position: relative;
на всех <li>
второго уровня:
.sf-menu ul li {
position: unset;
}
Чтобы второе подменю было по крайней мере таким же высоким, как первое подменю, вы можете установить min-height
во втором подменю ul
:
.sf-menu ul li ul {
min-height: 100%;
}
Возможно, вы захотите установить цвет фона в этом правиле css или выполнить дальнейшую стилизацию в соответствии с вашими потребностями.
person
kastenbutt
schedule
15.12.2019
спасибо, что он работает сейчас, и как мне разместить их на одной высоте, как будто они были одним блоком?
- person Christian; 15.12.2019
Я не уверен, что понимаю, что вы имеете в виду. Высота второго подменю зависит от количества элементов списка и их высоты. Не могли бы вы немного лучше объяснить, что вам нужно?
- person kastenbutt; 15.12.2019
В случае, если первый ‹ul› будет иметь 5 элементов, а второй ‹ul› (его дочерний элемент) имеет 3 элемента, у нас будет 5–3. высота первого ‹ul› будет выше, чем второго, я хочу, чтобы высота второго ‹uls› соответствовала высоте родителя
- person Christian; 15.12.2019