Blogging 101: Essential Blogger CSS/HTML Codes {part 1}

Blogger offers less than sufficient templates for its users (in my opinion, of course) with a lack in any real potential for customization outside of changing the font color and background photo. I'm not a professional coder, so I didn't know how to make my blog from scratch; yet, I am not a newbie to CSS/HTML whatsoever! I precisely wanted a clean design that could be changed if I ever decided to change my theme!

So, here is my series on basic blogger CSS codes you should utilize to enhance the physical appearance, usability, and smoothness of your blog--all codes you see on this blog! Most of these codes would take you at least a few hours to scour down yourself (that's what I did!), so here is the growing list of codes to enhance your blogs! Get coding, Internet!

Centering Your Header Text & Image

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

Eliminating Dropshadow & Borders on Images

.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; }

Centering Tab Links & Pages

.PageList {text-align:center !important;} .PageList li {display:inline !important; float:none !important;}

Customizing Sidebar Titles With a Side Border

sidebar h2 { background:url(URL OF THE PIC); background-repeat:no-repeat; background-position:top-left; padding-left: 1px; text-transform: lowercase; padding: 1px; border-left: 17px solid #COLOR CODE HERE; color:#COLOR OF TEXT HERE; font-size:20px; font-family: FONT FAMILY HERE font-weight: bold; margin:0 0 0 0px; letter-spacing: -1px; padding:4px 0em; line-height: 18px; text-indent:2px; }

Styling & Using Blockquotes

.post blockquote { max-width: 400px; width:auto; padding: 7px; margin:0 auto; background : #COLOR CODE HERE url(URL HERE) no-repeat right bottom; color : #TEXT COLOR CODE HERE; border:1px dashed #BORDER COLOR CODE HERE; border-radius:50px; }