Sunday

DEVIDE COLOMN FOOTER

If a single column footer you think still less, you can divide these into several colomn.Footer very useful for me, I think its function is similar to the sidebar.

I often look at various blogs, they like to use with three column footer, this really depends on individual taste . How to make it will be discussed together.

Usually different templates, different size accordance with .So size template you have, here we make use size percent (%), so you do not trouble to change . Make it let us see the steps below:

* Login to your blog.


* Click on the layout.


* Choose Edit HTML.


* Do not click expand widgets.


* Find code ]]></ b: skin> and place the following code on it, until

his position as follows:

/ * Footer_wrapper
---------------------------- * /
# footer_wrapper (
width: 100%;
position: relative;
float: left;
background: # ff69b4;
border: px solid # FF0000;
padding:%;
)

# footer_wrapper1 (
float: left;
width: 30%;
margin: 1px;
background: # 7cfc00;
padding: 1%;
)

# footer_wrapper2 (
float: left;
width: 30%;
margin-top: 1%;
margin-bottom: 1%;
background: # 7cfc00;
padding: 1%;
)

# footer_wrapper3 (
float: left;
width: 30%;
margin: 1%;
background: # 7cfc00;
padding: 1%;
)

]]></ b: skin>

* Then pull down on the body find the following code:

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

* If you've found, put the following code immediately above it so that

its position as follows:

<div id='footer_wrapper'>
<b:section class='footer' id='footer_wrapper1'/>
<b:section class='footer' id='footer_wrapper2'/>
<<b:section class='footer' id='footer_wrapper3'/>
</ div>

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

* And see the results on the layout, to see the results you need to

add the gadget.

Note: The code is the original red, black is the code added.


Hopefully useful.

No comments:

Post a Comment