Say
Yuz dɛn shɔthand yutiliti ya fɔ kɔnfigyut di pozishɔn fɔ wan ɛlimɛnt kwik kwik wan.
Di valyu dɛn we kɔmɔn
Kwik pozishɔn klas dɛn de, pan ɔl we dɛn nɔ de ansa.
<div class="position-static">...</div>
<div class="position-relative">...</div>
<div class="position-absolute">...</div>
<div class="position-fixed">...</div>
<div class="position-sticky">...</div>
Fiks di tɔp
Pozishɔn wan ɛlimɛnt na di tap pan di viupɔt, frɔm di ɛj to di ɛj. Mek shɔ se yu ɔndastand di ramifications fɔ fiks pozishɔn na yu prɔjek; yu kin nid fɔ ad ɔda CSS.
<div class="fixed-top">...</div>
Fiks di bɔt
Pozishɔn wan ɛlimɛnt na di bɔt ɔf di viupɔt, frɔm di ɛj to di ɛj. Mek shɔ se yu ɔndastand di ramifications fɔ fiks pozishɔn na yu prɔjek; yu kin nid fɔ ad ɔda CSS.
<div class="fixed-bottom">...</div>
Stika tɔp
Pozishɔn wan ɛlimɛnt ɔp di viupɔt, frɔm wan ɛj to di ɔda ɛj, bɔt na afta yu skrol pas am. Di .sticky-top
yutiliti de yuz CSS’s position: sticky
, we nɔ rili sɔpɔt na ɔl di brɔuza dɛn.
IE11 ɛn IE10 go rɛnd position: sticky
as position: relative
. As a so, wi de rap di stayl dɛn insay wan @supports
kwɛstyɔn, ɛn wi de stɔp di stika to jɔs brawza dɛn we go ebul fɔ rɛnd am fayn fayn wan.
<div class="sticky-top">...</div>