Tag fieldset
Kalau kamu perhatikan, tag <h1>
, <h2>
, <p>
dan banyak tag lainnya memposisikan elemen mereka bertumpuk dari atas ke bawah. Sedangkan tag seperti <input>
dan <button>
berjejeran ke samping. Hal ini karena kedua kelompok tersebut memiliki level yang berbeda
Kelompok pertama yang bertumpuk atas bawah berjenis Block-Level Elements (opens in a new tab), yang berarti element tersebut menggunakan seluruh ruang yang ada di baris tersebut untuk dirinya sendiri.
Sedangkan, tag yang berjejer ke samping berjenis Inline-Level Elements (opens in a new tab), artinya tag tersebut hanya menempati ruang sesuai dengan ukuran mereka saja.
Baiklah, mari kita kembali ke topik utama. Di dalam suatu <form>
kita dapat mengelompokkan input
dan label
di dalam satu kelompok yang sama menggunakan tag <fieldset>
.
Contoh
<fieldset>
<input type="radio" id="opsi-item-1" value="item1" /><label>Item #1</label>
<input type="text" id="input-teks" name="input1" />
</fieldset>
Tantangan
Masukkan semua input
bertipe radio
ke dalam tag <fieldset>
.