Properti margin-inline-end CSS

Halaman sebelumnya margin-inline
Halaman berikutnya margin-inline-start

Definisi dan penggunaan

margin-inline-end menentukan margin ujung arah baris.

Atribut CSS margin-inline dan margin-block Atribut dengan margin-top,margin-bottom,margin-left dan margin-right Atribut yang sangat mirip, tetapi margin-inline dan margin-block Atribut ini tergantung pada arah blok dan arah baris.

Perhatian:atribut CSS yang berhubungan writing-mode dan direction Mendefinisikan arah baris. Ini akan mempengaruhi posisi awal dan akhir elemen, serta margin-inline-end Hasil atribut. Untuk halaman berbahasa Inggris, arah blok adalah ke bawah, arah baris adalah dari kiri ke kanan.

Contoh

Contoh 1

Atur margin ujung arah baris.

div {
  margin-inline-end: 35px;
}

Coba sendiri

Contoh 2

Ketika nilai atribut <div> element writing-mode Ketika nilai atribut 'vertical-rl' disetel, arah baris adalah ke bawah. Hasilnya ujung elemen pindah dari sisi kanan ke bawah:

div {
  margin-inline-end: 50px;
  writing-mode: vertical-rl;
}

Coba sendiri

Contoh 3

Ketika nilai atribut <div> element direction Ketika nilai atribut 'rtl' disetel, arah baris adalah dari kanan ke kiri. Hasilnya ujung elemen pindah dari sisi kanan ke kiri:

div {
  margin-inline-end: 50px;
  direction: rtl;
}

Coba sendiri

Syntaks CSS

margin-inline-end: auto|length|initial|inherit;

Nilai atribut

Nilai	Deskripsi
auto	Nilai default. Nilai default margin-inline-end elemen.
length	Mengesahkan margin-inline-end dalam satuan px, pt, cm, dll. Memungkinkan nilai negatif. Lihat:Satuan CSS.
%	Mengesahkan margin-inline-end berdasarkan persentase ukuran elemen induk di arah baris.
initial	Atur atribut ini ke nilai default. Lihat initial.
inherit	Mengambil atribut ini dari elemen induknya. Lihat inherit.

Detil teknis

Nilai default:	auto
Inheritance:	Tidak
Produksi animasi:	Didukung. Lihat:Atribut yang berhubungan dengan animasi.
Versi:	CSS3
Syntaks JavaScript:	object.style.marginInlineEnd="50px"