Right хусусияти

right хусусияти элементнинг ўнг четининг ўрнини белгилайди. Хусусият учун қийматларни ўлчов бирликларида, масалан, пиксел, дюйм, пункт, фоизларда белгилаш мумкин. Бериладиган қийматлар манфий сонлар ҳам бўлиши мумкин, бу ҳолда элементлар бир-бирини устига қўйилади. Координаталар ҳисоби position хусусияти орқали аниқланади, у odatda relative (нисбий ўрни) ёки absolute (абсолют ўрин) қийматларини қабул қилади.

Синтаксис

cssселектор {
  right: ўлчам ёки auto;
}

Мисол

Фарзанд элементга курсорни олиб бorganimizda унинг ўнг чегарасининг ўрнини 25px га тенг қиламиз:

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

Результат:

Мисол

Энди эса фарзанд элементнинг ўнг чегараси курсор олиб бorganда -50px да жойлашсин:

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

Результат:

Шунингдек қаранг

  • bottom хусусияти,
    элементнинг пастки четининг ўрнини белгиловчи
  • top хусусияти,
    элементнинг юқори четининг ўрнини белгиловчи
  • left хусусияти,
    элементнинг чап четининг ўрнини белгиловчи
  • ::backdrop судэлемент,
    биринчи элементдан кейинги ўринни белгиловчи