Basic Blogger CSS Codes to Improve Your Blogger Blog

I love designing blogs and coding to make them look pretty, so I decided to share some basic CSS codes to help you achieve your dream blog design. I use all of these codes and they are so helpful. To apply the code to your blog, just go to "Customize Template > Advanced > Add CSS" then add the code into the box and save it.

REMOVE DEFAULT BLOGGER IMAGE BORDERS

.post-body img, .post-body .tr-caption-container, .Profile img, .Image img,

.BlogList .item-thumbnail img {

  padding: none !important;

  border: none !important;

  background: none !important;

  -moz-box-shadow: 0px 0px 0px transparent !important;

  -webkit-box-shadow: 0px 0px 0px transparent !important;

  box-shadow: 0px 0px 0px transparent !important;

}

CENTER YOUR BLOG HEADER

#header-inner img {margin: 0 auto !important;} #header-inner {text-align:center !important;}

CENTER YOUR POST AND DATE TITLES

.post-title {
text-align:center;
}


.date-header {
text-align:center;
}

CENTER PAGE TABS

.PageList {text-align:center !important;}

.PageList li {display:inline !important; float:none !important;}

DECREASE THE SPACE BETWEEN POST TITLE AND DATE HEADER

h3.post-title {
margin-top: -25px !important;
}  

(edit the red text to your liking)



ITALIC LINKS ON HOVER

 a:hover { color: none; font-style: italic;
text-decoration: none; }

(if you wish for the link to change color on hover as well, then just replace the red text with the name of a basic color or the color html code) 


I hope that you found these codes helpful!
Be sure to let me know if you have any trouble with them or if you would like the code for something else. I would love to help you. :)

xo Rachelle