Membagi tab header menjadi dua bagian Membagi tab header menjadi dua bagian - Blog Manado - Tutorial Web Design

Membagi tab header menjadi dua bagian

Membagi tab header menjadi dua bagian
Share

Membagi tab header menjadi dua bagian

Pada bagian header, banyak yang memanfaatkan kolom ini untuk menaruh iklan atau sebagainya. untuk itu saya pada postingan kali ini memberikan cara untuk Membagi tab header menjadi dua bagian.

Nah untuk langkah demi langkah seperti biasa, lalu masuk ke menu Edit HTML, lanjutkan dan centang pada kotak edit expand widget dan cari CSS header seperti #header-inner #header-wrapper #header, kemudian gantikan kode tersebutdengan kode CSS seperti dibawah ini



#header-wrapper {
12345678910111213141516171819202122width:970px;
margin:0 auto 0px;
background:#ffff;
height:150px;
}
#header-kanan {
width:400px;
background-position: left;
margin-left: auto;
margin-right:auto;
float:left;
}
#header-kiri{
width:400px;
float:left;
padding-top:10px;
}
#header {
margin: 0px;
text-align: left;
color:#ccc;
}
  • Jika sudah, mari lanjutkan mencari kode seperti dibawah ini
<div id='header-wrapper'> hingga kode  </b:section></div>
  • Intinya sobat harus menggantikan kode mulai dari <div id='header-wrapper'> hingga sampai kode terbawah tag header kode </b:section></div> untuk digantikan dengan kode dibawah ini
1234567891011
<div id='header-wrapper'>
<div id='header-kanan'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Gaptek32 (Header)' type='Header'/>
</b:section>
</div>
<div id='header-kiri'>
<b:section class='header' id='header2' preferred='yes'/>
</div>
</div>

  • Kemudian save

0 Response

Post a Comment

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel