Position Property

position က element ရဲ့နေရာချထားပုံကိုထိန်းပါတယ်။ Default က static ပါ။ relative က မူလနေရာကိုအခြေခံပြီးနည်းနည်းရွှေ့ချင်တဲ့အခါသုံးတယ်။ absolute က positioned parent ကိုမူတည်ပြီးနေရာချတယ်။ fixed က browser viewport ကိုကပ်ထားတာဖြစ်ပြီး scroll လုပ်လည်းမရွေ့ပါ။ sticky က normal flow နဲ့ fixed ကြားက hybrid လိုပါပဲ။

.chat-button {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 50;
}

.badge {
  position: absolute;
  top: 8px;
  right: 8px;
}

Chat button က browser ညာဘက်အောက်မှာအမြဲပေါ်နေမယ်။ Badge က parent card ရဲ့ ညာဘက်အပေါ်မှာကပ်နေပါမယ်။