Di Tailwind CSS, padding digunakan untuk menambahkan ruang antara konten elemen tertentu dan batasnya. Itu menambahkan jarak ekstra di dalam elemen. Tailwind CSS menyediakan seperangkat utilitas padding dan nilai padding yang memungkinkan pengguna untuk menyesuaikan spasi elemen yang diinginkan. Selain itu, pengguna dapat menambahkan bantalan pada satu sisi, seperti bagian atas, bawah, kiri, atau kanan elemen tertentu.
Blog ini akan mendemonstrasikan contoh untuk menambahkan padding ke satu sisi elemen di Tailwind CSS.
Bagaimana Cara Menambahkan Padding ke Satu Sisi di Tailwind?
Untuk menambahkan pengisi ke satu sisi elemen di Tailwind, kelas utilitas berikut dapat digunakan:
Untuk memahaminya dengan lebih baik, lihat contoh yang diberikan di bawah ini.
Contoh 1: Tambahkan Padding ke Bagian Atas Elemen
Dalam contoh ini, kita akan menggunakan “ pt-10 ” kelas utilitas di “ Contoh 2: Tambahkan Padding ke Bagian Bawah Elemen Dalam contoh ini, kita akan menggunakan “ pb-10 ” kelas di “ Contoh 3: Tambahkan Padding ke Kanan Elemen Dalam contoh ini, kita akan menggunakan “ pr-10 ” kelas di “ Contoh 4: Tambahkan Padding ke Kiri Elemen Dalam contoh ini, kita akan menggunakan “ pl-10 ” kelas di “ Untuk menambahkan pengisi ke satu sisi elemen di Tailwind, berbagai kelas utilitas dapat digunakan, seperti “ pl-
< div kelas = 'bg-merah muda-600 pt-10 w-max' >
Lapisan di dalam CSS penarik
div >
tubuh >
Keluaran
Output di atas menunjukkan bahwa padding telah ditambahkan ke bagian atas wadah.
< div kelas = 'bg-merah muda-600 pb-10 w-max' >
Lapisan di dalam CSS penarik
div >
tubuh >
Keluaran 
Dapat dilihat bahwa bantalan telah ditambahkan ke bagian bawah wadah.
< div kelas = 'bg-pink-600 pr-10 w-max' >
Lapisan di dalam CSS penarik
div >
tubuh >
Keluaran 
Output di atas menunjukkan bahwa padding telah ditambahkan di sebelah kanan elemen container.
< div kelas = 'bg-pink-600 pl-10 w-max' >
Lapisan di dalam CSS penarik
div >
tubuh >
Keluaran 
Dapat diamati bahwa padding telah ditambahkan ke kiri wadah. Kesimpulan