How to Add Stylish Archive Widget for Blogger Blog/Blogspot With Hover

Add CSS with hover  and Style Your Blogger Archive Very Nice Like Below 

Step 1: Add Archive Widget

1st go to your Blog's Dashboard --> Layout --> Add a Gadget and select Blog Archive from the list. Don't forget to select Flat List style. Now Save the Gadget.

Like below Image

How to Add CSS :

Go your Blog's Dashboard navigate to go Template --> Customise --> Advanced --> Add CSS. Copy this Code paste one of the below codes and click Apply to Blog.

*********************************************************************************

.BlogArchive #ArchiveList ul li{

    padding: 7px 0 7px 20px;

    background-color: #33FF00;

    Color: #fff;

    height:auto;

}

.BlogArchive #ArchiveList ul li:visited{ 

    background-color: gray;

 }

.BlogArchive #ArchiveList ul li:active{ 

    background-color: yellow; 

}

.BlogArchive #ArchiveList ul li:hover{

   background-color: #FE80DF;

}

*********************************************************************************