How To Split Header Column to 2 Columns in Blogger

To do this, Just follow these following steps:

1. Log in to your dashboard–> layout- -> Edit HTML
2. Scroll down to where you see code like this:

<!-- Header -->
#header-wrapper {
width:900px;
margin:0 auto 0px;
height:190px;
}
#header-inner {
width:900px;
background-position: center;
margin-$startSide: auto;
margin-$endSide: auto;
}
#header {
margin: 0px;
text-align: left;
color:$pagetitlecolor;
}

3. Replace above code with below code.

<!-- Header -->

#header-wrapper {

width:900px;

margin:0 auto 0px;

height:190px;

}

#head-inner {

width:600px;

background-position: left;

margin-left: auto;

margin-right: auto;

float:left;

}

#header {

margin: 0px;

text-align: left;

color:#ffcc66;

}

#r_head{

width:300px;

float:left;

padding-top:10px;

}

4. Now again Scroll down to where you see code like this :

<div id=’header-wrapper’>
<b:section class=’header’ id=’header’ maxwidgets=’1′ showaddelement=’no’>
<b:widget id=’Header1′ locked=’true’ title=’Test Blog (Header)’ type=’Header’/>
</b:section>
</div>
5.Replace above code with below code.
<div id=’header-wrapper’>
<div id=’head-inner’>
<b:section class=’header’ id=’header’ maxwidgets=’1′ showaddelement=’no’>
<b:widget id=’Header1′ locked=’true’ title=’Test Blog (Header)’ type=’Header’/>
</b:section>
</div>
<div id=’r_head’>
<b:section class=’header’ id=’header2′ preferred=’yes’/>
</div>

</div>

6.Click on “Save Template” and you are done.