CSS : Footer should be on Foot

Makanya aneh bila menemukan footer yang bukan pada tempatnya.Kenapa dinamakan bagian footer karena memang dia akan menjadi catatan kaki, bukan catatan samping kan?.Jadi posisinya wajib berada di bagian bawah.Beda template sekalipun pasti menempatkan bagian header dan footer di tempat yang serupa.Berada diatas dan dibawah.

Untuk itu bila menemukan bagian footer yang nempel dibagian sidebar mesti cepat-cepat dilihat bagian CSSnya.Lalu cek silang dengan menggunakan browser yang berbeda.Bisa jadi hasilnya pun berbeda.Bila ini terjadi dipastikan bagian CSSnya perlu dilakukan pembenahan, karena browser memiliki kemampuan yang berbeda dalam memberlakukan CSS yang dibacanya.

Berikut contoh tampilan footer yang nempel pada bagian Sidebar (milik Bebex) bila diakses menggunakan Mozilla Firefox :

CSS :

#footer {
margin: 0 auto;
padding: 0;
width: 780px;
text-align: center;
background: transparent;
font-size: 11px;
color: #FFFFFF;
}

Sedang berikut tampilan normal yang ada di IE :

CSS :

#footer {
clear:both;
margin: 0 auto;
padding:15px 30px 0 50px;
width: 780px;
text-align: center;
background: transparent;
font-size: 11px;
color: #FFFFFF;
}

artinya perlu penambahan tag CSS clear:both; agar turun kebawah dan memberikan space yang lebih lapang untuk bagian footernya.Dengan cara ini, baik di IE maupun Mozilla tampilan footer akan berada pada tempat yang semestinya.Sedangkan perubahan nilai pada padding hanya untuk memberikan sedikit ruang pada footer agar tidak menempel dengan bagian postingan.

5 pemikiran pada “CSS : Footer should be on Foot

  1. Ini terjadi karena kesalahan edit template ato gimana mas Agus. Soalnya biasanya kita kan ambil template dari layanan template gratis atau dari temen. Makasih atas penjelasannya

    Suka

  2. kemungkinan yang biasanya terjadi adalah template yang diluar template yang disediakan blogger hanya berbasis utk kepentingan salah satu browser, maka tak banyak tag CSS yang disertakan.

    Suka

  3. wedeh,,,gara2 postingan begene,,,bex jadi masuk top rating neh ..
    cieeehh even cuma masuk urutan 5,bebex cukup bangga om!
    thanx yeee (piz)

    Suka

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s