Everybody who familiar with internet should know what is blogging and blogging is become one of the famous internet tool to provide information, personal interest, hobbies, event and etc.

Can you make money by blogging? The answer is YES.

Some of the famous/pro blogger make 6 figures income every month.

Below are some proof and hope that maybe a bit of inspiration for improving your blogging.

Related posts:

1. How Much Does a Super Affiliate Earn Every Month?
2. Who is John Chow?
3. How to Start Blogging with Blogger
4. Make Money with Google Adsense
5. How To Apply A Google Adsense Account

Few day ago, I received some comments from my reader regarding my last post on How to Create Horizontal Tabs Menu in Blogger. They use my method to create the horizontal tab but at the end,  they created a bulleted list of links.  So I decide to log in my blogger account and take a look for this issue.

After testing on several of blogger template, the original code create vertical tab instead of horizontal tab.

Therefore, I check the code again and what I found was the CSS code was missing after change the template.  As you can see as above picture.  Seem like this is Blogger’s problem and I have not idea why the CSS code is missing every time I change a new template.  Without the CSS code, there will be no horizontal tab.

How do we create the horizontal tab? Basically, we need 2 different code i.e. widget Code and CSS code. The widget code create a list of links and CSS code change the style of the links into horizontal tab.

Therefore, without the CSS code, your links will be vertical tab as default.

Widget code: Create the list of links

<ul id=”nav”>

<li><a href=”#”>Home</a></li>
<li><a href=”#”>About</a></li>
<li><a href=”#”>Services</a></li>
<li><a href=”#”>Products</a></li>
<li><a href=”#”>Sitemap</a></li>
<li><a href=”#”>Help</a></li>
<li><a href=”#”>Contact Us</a></li>

</ul>

The Solution:

I copy all the Missing CSS code (as below) again and then paste into the template HTML Code (you need to expand widget templates to see the whole template HTML code) before ” ]]></b:skin>”.

CSS Code: change the links into horizontal tab

#nav
{
padding:0;
}

#nav li
{
display:inline;
}

#nav li a
{
font-family:Arial;
font-size:12px;
text-decoration: none;
float:left;
padding:10px;
background-color: #333333;
color:#ffffff;
border-bottom:1px;
border-bottom-color:#000000;
border-bottom-style:solid;
}

#nav li a:hover
{
background-color:#9B1C26;
padding-bottom:12px;
border-bottom:2px;
border-bottom-color:#000000;
border-bottom-style:solid;
margin:-1px;
}

After I added the missing CSS code, I create the horizontal tab at my template.

I hope this solution can resolve all my reader’s problem.

IF above solution still not solve your problem then drop me a comment and I will look into your blogger’s code.

Related posts:

1. How to Create Horizontal Tabs Menu in Blogger
2. 31 Ways to Make a Girl Smile :)
3. How to Start Blogging with Blogger
4. Why You Should Updated Your Firefox to Firefox 3.6
5. How To Apply A Google Adsense Account

Today I will discuss about “how to start blogging with google blogger”.   Blogger is a free hosting and domain for blog.  If you are newbie and want to learn how to blog then blogger is the easy and free for you to start.

When I start my “blogging career”, i choose blogger as my first blogging platform – reason is FREE.  And it is easily to use and blogger own by google.

My first blog is about Island, you can check here. 

Here is the short video to start setup a free account in blogger.

Related posts:

1. How To Apply A Google Adsense Account
2. How to create Free Wordpress Blog – Step by Step Tutorials
3. How Much Does a Pro Blogger Make every Month?
4. How to Create Horizontal Tabs Menu in Blogger – Part 2
5. Who is John Chow?