Неверные координаты якоря из-за меню

Решено Asome
(@asome)

4 года, 1 месяц назад

Здравствуйте!
На сайте из-за плавающего (липкого) меню неправильно срабатывает якорь – есть оглавление с ссылками, которые ведут на подтемы, но «координаты приземления» сбиваются.

Нужно как-то с помощью CSS учесть расстояние меню, чтобы компенсировать промах? В мобильной версии якорь работает правильно – точно пересылает на нужную подтему.

Просмотр 3 ответов — с 1 по 3 (всего 3)

mi13
(@mi13)

4 года, 1 месяц назад

ссылку на страницу можно
kword
(@kw56)

4 года, 1 месяц назад
Нужно как-то с помощью CSS учесть расстояние меню, чтобы компенсировать промах?

Добавьте к id якоря нужный сдвиг на высоту шапки
```
#my-anchor {
    padding-top: 44px;
    margin-top: -44px;
}
```
В мобильной версии якорь работает правильно – точно пересылает на нужную подтему

Потому что нет «липкой» шапки, видимо. Тогда в css надо добавить медиа запросы
Автор Asome
(@asome)

4 года, 1 месяц назад

mi13, спасибо за желание помочь, но уже всё решил =)

kword, спасибо за ответ! Буквально за день-два до Вашего ответа сам всё нашёл. Думал, что смогу всё решить «автоматически», добавив код, но оказалось, что нужно каждому блоку приписывать название.

Статьи пишу через Gutenberg, поэтому там всё по-хитрому:
Нужно нажать на блок, выбрать Дополнительно, потом появится «Дополнительный(-ые) класс(ы) CSS» (там нужно вписать нужное название, которое будет в CSS содержать все настройки).

А вот за наводку про медиа запросы огромное спасибо!

Просмотр 3 ответов — с 1 по 3 (всего 3)

Тема «Неверные координаты якоря из-за меню» закрыта для новых ответов.

Метки темы

Просмотр