Melebarkan Area Postingan atau Mengecilkan Sidebar - Minima Today #1

Seri minima today bener-bener membantu Anda untuk mengubah template Anda. Mulai dari nol hingga ke tingkat lanjut. Kembali lagi membahas template minima, kali ini saya akan membahas pesanan yang banyak datang yakni cara melebarkan area postingan. Mari kita langsung saja bahas.

Keadaan standart lebar postingan (main-wrapper) minima adalah 410 px. Sedangkan lebar standart sidebar (sidebar-wrapper) adaah 220 px. Kodenya seperti berikut ini.

#main-wrapper {
  width: 410px;
  float: $startSide;
  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
  overflow: hidden;     /* fix for long non-text content breaking IE sidebar float */
  }

#sidebar-wrapper {
  width: 220px;
  float: $endSide;
  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
  overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
}

Nah, kode lebar ditunjukkan oleh width. Saya beri warna merah. Jika Anda ingin merubahnya silahkan rubah kode bagian itu. Ganti saja angkanya dengan angka yang Anda mau, pertahankan satuan pixel (px). Agar tidak terjadi error seperti jatuhnya sidebar tetap jaga jumlah lebar postingan dan lebar sidebar agar muat di outer-wrapper. (Pembahasan mengenai kaitan outer-wrapper di bahas di seri selanjutnya.).

Misal lebar standart postingan (410px) + lebar standart sidebar (220px) adalah 630px
Maka jika Anda melebarkan postingan, maka Anda harus kecilkan sidebar.
Misal lebar postingan menjadi 450px + ditambah sidebar yang dikceilkan menjadi 180px, hasilnya tetap 630px.


Silahkan mencoba utak-atik template Anda dengan contoh minima ini. Semoga bermanfaat.

Komentar

Posting Komentar

Postingan Populer