Я строю адаптивную навигацию с использованием Tailwindcss, и я пытаюсь переключить его позиционирование с Absolute On мобильный (
Код: Выделить всё
sm
Вот мой штрих -код навигации:
Код: Выделить всё
[url=#]Logo[/url]
[list]
[*][url=#]Home[/url]
[*][url=#]About[/url]
[*][url=#]Services[/url]
[*][url=#]Contact[/url]
[/list]
Что я ожидал, что произойдет:
- на мобильном телефоне (и меньше), UL должен быть абсолютным , расположенным ниже Navbar.
Код: Выделить всё
sm
- At md (и больше), MD: относительный должен переопределить Absolute , делая UL нормальной частью потока документов.
Код: Выделить всё
768px
- Абсолютный < /code> класс остается примененным даже на MD < /code> breakpoint. < /li>
не переопределяет Absolute , как и ожидалось. : относительный .
Код: Выделить всё
md:relative
Код: Выделить всё
variants: {
extend: {
position: ['responsive']
}
}
< /code>
< /li>
[b] принудительное восстановление Tailwind (npm run dev
[*] вручную применяется относительный в медиа -запросе (
Код: Выделить всё
@media (min-width: 768px) {}
Вопрос: < /h3>
Почему MD: относительный не переоценка Absolute в MD точке останова в Tailwindcss? Как я могу исправить это так, чтобы относительный правильно применялся, когда ширина экрана достигает 768px ? И другие стили, которые нуждаются в точке перерыва MD?>
Подробнее здесь: https://stackoverflow.com/questions/794 ... y-other-st