Смещение при переходе на якорную ссылку для 5-ти разрешений
Работает, если на сайте используется блок T173 «Якорная ссылка». Используй смещение, если на сайте есть фиксированное меню и при этом высота меню отличается на различных разрешениях. Тогда меню не будет перекрывать контент, когда пользователь перешел по якорной ссылке.
Как сделать
- Укажи в настройках величину смещения под каждое разрешение.
- Скопируй сгенерированный код и вставь на свой сайт. Памятка по вставке кода.
<!-- https://romanyu.ru/smeshchenie-yakornaya-ssylka -->
<style>
[data-record-type="215"] {
/* Укажи величину смещения для разрешения больше 1200px */
top: -160px;
position: relative;
}
@media (max-width: 1199px) {
[data-record-type="215"] {
/* Укажи величину смещения для разрешения 961-1200px */
top: -110px;
position: relative;
}
}
@media (max-width: 959px) {
[data-record-type="215"] {
/* Укажи величину смещения для разрешения 641-960px */
top: -110px;
position: relative;
}
}
@media (max-width: 639px) {
[data-record-type="215"] {
/* Укажи величину смещения для разрешения 481-640px */
top: -75px;
position: relative;
}
}
@media (max-width: 479px) {
[data-record-type="215"] {
/* Укажи величину смещения для разрешения меньше 480px */
top: -75px;
position: relative;
}
}
</style>Понравилось решение?
Закинь денежку в благодарность за крутые и полезные модификации для Тильды!
Код успешно скопирован!