How to Divide Footer column into 3 column

How to Divide Footer column into 3 column

A perfect design of blog is attract the visitors and improve the traffic on blog. Here I will show you how to divide or split footer column into 3 column, due to this you have more space and you can add more and more widgets on your blog. For split the footer column just follow given steps.

Split footer column into 3 column

• Login on Blog  >>  Dashboard  >>  Template  >>  Edit Html.
• Find the given code (clt+f).

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

• Replace the Above code with the Code shown below.

<div id='footer-wrapper'>
<div id='footer-column-container'>
<div id='footer2' style='width: 30%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/>
</div>
<div id='footer3' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/>
</div>
<div id='footer4' style='width: 30%; float: right; margin:0; text-align: left;'>
<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/>
<p>
<hr align='center' color='#cccccc' width='90%'/></p>
<div id='footer-bottom' style='text-align: center; padding: 10px; text-transform: lowercase;'>
<b:section class='footer' id='col-bottom' preferred='yes'/>
</div>
<div style='clear:both;'/>
</div>
</div>

• Save and Done.