Properti left

Properti left mengatur posisi tepi kiri elemen. Nilai untuk properti dapat ditulis dengan satuan ukuran yang umum digunakan, contohnya, dalam piksel, inci, poin, persen. Nilai yang ditetapkan juga dapat berupa angka negatif, dalam hal ini elemen akan saling tumpang tindih. Penghitungan koordinat ditentukan oleh properti position, yang biasanya mengambil nilai relative (posisi relatif) atau absolute (posisi absolut).

Sintaks

cssselektor {
  left: ukuran atau auto;
}

Contoh

Mari saat hover pada elemen anak atur posisi tepi kirinya menjadi 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 {
  left: 25px;
  width: 100px;
  height: 100px;
  border: 1px solid red;
}

Результат:

Contoh

Sekarang mari saat hover, tepi kiri elemen anak diposisikan pada -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 {
  left: -50px;
  width: 100px;
  height: 100px;
  border: 1px solid red;
}

Результат:

Lihat juga