CSS Style Cheat Sheet for Blogger

To Make extra large images on your blog re-size to the blog space available, add this code to your css.  You can change the max width percent if you want the image slightly smaller than 100%.


img {
max-width: 100%;
height: auto;
width: auto\9; /* ie8 */
}

To tighten up the space between gadgets (widgets) on your side bars use the following code, you will need to find out what your gadget (widget) id is and put it in place of the Red title.


#HTML21{
margin-top: -50px !important;
}

To change heading font styles on your blog.  The following will give you a style that looks like the example below the code.  Change h2 to h1 or h3 to make changes to your Heading, Sub Heading or  Minor Heading.

.post h2{
line-height: 1em; color: #FE2EF7; font-weight:normal; font-size: 20px; text-shadow:0px 0px 0 rgb(-365,-325,-255), 0px -1px 0 rgb(-620,-580,-510),0px -2px 1px rgba(0,0,0,1),0px -2px 1px rgba(0,0,0,0.5),0px 0px 1px rgba(0,0,0,.2);}

This is What the Code Above looks like on a Heading!

This code is what I use for my Blog Post Titles (it will also format your Minor Headings the same).


.post h3{
color:#0080ff;
border-top:2px dotted #B404AE;
border-bottom:2px dotted #B404AE;
border-right:2px dotted #B404AE;
border-left:2px dotted #B404AE;
padding:1px;}

This is one of the websites that I use for help: http://www.mybloggertricks.com/2008/03/blogger-tips-and-tricks.html
Enjoy and I hope these help!