Hilangkan Funky Spaces di Tabel HTML Anda

Jika Anda menggunakan tabel untuk tata letak halaman — yang tidak-tidak di XHTML , by the way — kemungkinan Anda akan mengalami penambahan ruang ekstra yang tidak sedap dipandang dalam tata letak Anda. Untuk memperbaiki masalah ini Anda perlu memeriksa kedua definisi tabel HTML Anda dan spesifik dari setiap style sheet yang mengatur.

Definisi Tabel HTML

Tag HTML untuk tabel secara default tidak mengontrol beberapa persyaratan jarak. Verifikasi tiga hal tentang tag tabel dalam dokumen HTML Anda:

  1. Apakah tabel Anda memiliki atribut cellpadding diatur ke 0?
    1. cellpadding = "0"
  2. Apakah tabel Anda memiliki atribut cellspacing diatur ke 0?
    1. cellspacing = "0"
  3. Apakah ada spasi sebelum atau sesudah konten Anda dan tag tabel?

Nomor 3 adalah penendang. Banyak editor HTML yang suka semua kode diberi spasi, agar mudah dibaca. Tetapi banyak browser menginterpretasikan tab, spasi, dan pengantaran kembali seperti ruang ekstra yang diinginkan di dalam tabel Anda. Singkirkan ruang putih di sekitar tag Anda dan Anda akan memiliki tabel yang lebih tajam.

Style Sheets

Namun, itu mungkin bukan HTML yang tidak aktif. Lembar gaya Cascading mengontrol beberapa atribut tampilan tabel dan bergantung pada halaman, Anda mungkin atau mungkin tidak sengaja menambahkan CSS khusus tabel di tempat pertama.

Pindai file CSS yang mengatur untuk salah satu nilai berikut di dalam tabel, th atau td properti dan sesuaikan seperlunya:

Alternatif

Meskipun Anda masih dapat menggunakan tabel HTML — standarnya sudah mapan dan didukung secara universal di browser saat ini — sebagian besar desain Web responsif modern menggunakan lembar gaya kaskade untuk menempatkan elemen pada halaman. Tabel masih masuk akal untuk tujuan awal mereka menampilkan data tabular, tetapi untuk mengatur tata letak dan konten halaman, Anda lebih baik menggunakan tata letak CSS sebagai gantinya.