Right xususiyati

right xususiyati elementning o‘ng chekasi holatini belgilaydi. Xususiyat uchun qiymatlar o‘lchov birliklari bilan, masalan, piksellar, dyuymlar, punktlar, foizlarda berilishi mumkin. Belgilangan qiymatlar manfiy sonlar ham bo‘lishi mumkin, bu holda elementlar bir-birining ustiga chiqadi. Koordinatalarni hisoblash position xususiyati bilan belgilanadi, odatda relative (nisbiy holat) yoki absolute (absolyut holat) qiymatlarini qabul qiladi.

Sintaksis

cssselektor {
  right: o‘lcham yoki auto;
}

Misol

Keling, child elementga sichqoncha olib borilganda uning o‘ng chegarasi holatini 25px ga tenglaymiz:

html<div id="elem">
  <p></p>
</div>

css#elem {
  width: 400px;
  height: 300px;
  border: 1px solid black;
}
p {
  position: relative;
  width: 100px;
  height: 100px;
  border: 1px solid red;
  margin-left: 50px;
}
p:hover {
  right: 25px;
  width: 100px;
  height: 100px;
  border: 1px solid red;
}

Результат:

Misol

Endi esa sichqoncha olib borilganda child elementning o‘ng chegarasi -50px da joylashsin:

html<div id="elem">
  <p></p>
</div>

css#elem {
  width: 400px;
  height: 300px;
  border: 1px solid black;
}
p {
  position: relative;
  width: 100px;
  height: 100px;
  border: 1px solid red;
  margin-left: 50px;
}
p:hover {
  right: -50px;
  width: 100px;
  height: 100px;
  border: 1px solid red;
}

Результат:

Shuningdek qarang