Baru kali ini dapetin solusi untuk masalah layout CSS list ul/ol (unordered list/ordered list) apabila diletakkan di samping gambar/foto yang di float. Hasil dengan CSS biasa, menyebabkan bullet/number di bagian samping atau sebelah foto atau gambar tidak inden secara fluid dengan paragrap. Ini tentunya tidak nyaman dilihat. Contoh berikut ini cara untuk meratakan bullet/list ul/ol dengan paragraf. Makanya langsung diposting biar ga lupa. Hehehe…
Lihat contoh di bawah. Sungguh tidak menyenangkan sekali bukan?
Kadang kejadiannya seperti ini:
Padahal maunya hasilnya seperti ini:
Caranya cuma ngubah CSS utk ul/ol dan li seperti ini:
ul, ol {
margin-left: 0;
padding-left: 0;
}
ul li, ol li {
margin-left: 0;
padding-left: 0;
position: relative;
left: 20px;
}Lihat demo di sini.
