ଅବସ୍ଥାନ

ଏକ ଉପାଦାନର ସ୍ଥିତିକୁ ଶୀଘ୍ର ବିନ୍ୟାସ କରିବା ପାଇଁ ଏହି ଶୋର୍ଥାଣ୍ଡ୍ ୟୁଟିଲିଟିଗୁଡିକ ବ୍ୟବହାର କରନ୍ତୁ |

ସାଧାରଣ ମୂଲ୍ୟଗୁଡ଼ିକ |

ଦ୍ରୁତ ପୋଜିସନ୍ କ୍ଲାସ୍ ଉପଲବ୍ଧ, ଯଦିଓ ସେଗୁଡ଼ିକ ପ୍ରତିକ୍ରିୟାଶୀଳ ନୁହେଁ |

<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>

ଫିକ୍ସଡ୍ ଟପ୍ |

ଭ୍ୟୁପୋର୍ଟର ଉପରି ଭାଗରେ ଏକ ଉପାଦାନ ରଖନ୍ତୁ, ଧାରରୁ ଧାର ପର୍ଯ୍ୟନ୍ତ | ନିଶ୍ଚିତ କର ଯେ ତୁମେ ତୁମର ପ୍ରୋଜେକ୍ଟରେ ସ୍ଥିର ସ୍ଥିତିର ପ୍ରଭାବ ବୁ understand ିଛ; ଆପଣଙ୍କୁ ଅତିରିକ୍ତ CSS ଯୋଡିବାକୁ ପଡିପାରେ |

<div class="fixed-top">...</div>

ସ୍ଥିର ତଳ |

ଭ୍ୟୁପୋର୍ଟର ତଳ ଭାଗରେ, ଧାରରୁ ଧାର ପର୍ଯ୍ୟନ୍ତ ଏକ ଉପାଦାନ ରଖନ୍ତୁ | ନିଶ୍ଚିତ କର ଯେ ତୁମେ ତୁମର ପ୍ରୋଜେକ୍ଟରେ ସ୍ଥିର ସ୍ଥିତିର ପ୍ରଭାବ ବୁ understand ିଛ; ଆପଣଙ୍କୁ ଅତିରିକ୍ତ CSS ଯୋଡିବାକୁ ପଡିପାରେ |

<div class="fixed-bottom">...</div>

ଷ୍ଟିକି ଟପ୍ |

ଭ୍ୟୁପୋର୍ଟର ଉପରି ଭାଗରେ ଏକ ଉପାଦାନ ରଖନ୍ତୁ, ଧାରରୁ ଧାର ପର୍ଯ୍ୟନ୍ତ, କିନ୍ତୁ ଆପଣ ଏହାକୁ ଅତୀତ ସ୍କ୍ରୋଲ୍ କରିବା ପରେ | .sticky-topଉପଯୋଗିତା CSS ର ବ୍ୟବହାର କରେ , position: stickyଯାହା ସମସ୍ତ ବ୍ରାଉଜରରେ ସମ୍ପୂର୍ଣ୍ଣ ସମର୍ଥିତ ନୁହେଁ |

IE11 ଏବଂ IE10 position: stickyପରି ପ୍ରଦର୍ଶନ କରିବ position: relative| ଏହିପରି, ଆମେ @supportsଶ yles ଳୀଗୁଡ଼ିକୁ ଏକ ଜିଜ୍ଞାସାରେ ଗୁଡ଼ାଇ ରଖୁ, କେବଳ ବ୍ରାଉଜର୍ରେ ଷ୍ଟିକ୍ସିକୁ ସୀମିତ କରେ ଯାହା ଏହାକୁ ସଠିକ୍ ଭାବରେ ଉପସ୍ଥାପନ କରିପାରିବ |

<div class="sticky-top">...</div>