CSS: scroll-margin in scroll-padding

Sidra običajno srečamo na spletnih straneh, namenjena so skakanju na točno določene dele vsebin. Slabost sider pa je, da pozicija ni vedno najbolj natančna.

Sidra oz. v angleščini “anchors” se običajno uporabljajo pri daljših vsebinah ali pristajalnih straneh z veliko vsebine. Lahko pa se uporabijo tudi za t.i. povezave “na vrh strani”, ki se običajno nahajajo na koncu strani.

CSS znački scroll-margin in scroll-padding nam omogočata reševanje problema natančnosti sider, saj lahko pozicijo sider prilagajamo (gor/dol/levo/desno), slednja pa ne vpliva na sam izgled strani, ampak samo na začetek sidra.

Primer uporabe scroll-margin-top

See the Pen
CSS: scroll-margin-top/bottom
by Ziga (@pomagalnik)
on CodePen.

Obe znački, scroll-margin in scroll-padding sta zelo dobro podprti v vseh večjih oz. boljših brskalnikih.

Pri CSSju mi je najbolj všeč to, da skozi leta dobivamo vse več funkcionalnosti za katerimi smo lahko včasih samo sanjali. Probleme je bilo reševati veliko težje z veliko iznajdljivosti, sedaj pa lahko že z eno vrstico CSS kode popravimo zadeve, kot želimo. Noro.

Komentiraj


*