Tiny icons (Autumn leaves, a few veggies)

[hobbitholes]

The leaves are really starting to turn where I live! How about you? I just hope it doesn't rain because I like crunching the leaves!

Someone asked me to make a carrot or tomato a while ago and I forgot who it was but I also included them here :)



Test: hobbitholes, saucydwellings
*Viewing this entry from your friends list/the default entry page? Click here for a preview on my journal :)
Images:
Look best on very light backgroundsBirch (height: 15px, width: 9px)






Oak (height: 15px, width: 11px)





Maple (height: 15px, width: 14px)





Sweetgum (height: 14px, width: 14px)





Misc




Zip file

Notes about the code:

• Works for Internet Explorer 7+, Firefox, and newer browsers in general. Internet Explorer 6 or below will only display one icon.
  
• The code below doesn't work on all styles. If this is the first time you're doing tiny icon customizations AND the code doesn't work below, then go to your style's community to find the appropriate code.
  
• See this post by babytest for more information. I originally got the code from the tiny code generator by loveicon but modifications like l-stat in the URL of the images and !important for the paddings need to be added.

Installation Instructions:
1. Save tiny icons to your own image host.

2. Code: Copy and paste the code below into notepad. After you've uploaded your images and put them into the code, change the height and width for the image (in red and orange), and tweaked the last two padding numbers to how you see fit, paste it all into the custom stylesheet box.

##px = height, ##px = width, 1px = padding from bottom, 2px = padding from left

CODE:
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color:transparent;
/* so that IE users will still see an image */

background-image: url(YOUR IMAGE FOR THE USER);
padding: ##px ##px 1px 2px !important;
}

.ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif?v=2"] {
width: 0;
height: 0;
background-repeat: no-repeat;
background-image: url(YOUR IMAGE FOR THE USER) !important;
padding: ##px ##px 1px 2px !important;
}

.ljuser img[src="http://l-stat.livejournal.com/img/community.gif?v=2"] {
width:0;
height: 0;
background-repeat: no-repeat;
background-image: url(YOUR COMMUNITY IMAGE) !important;
padding: ##px ##px 1px 2px !important;
}

3. Lastly, edit your userinfo and paste this into the bio section:

Tiny icons by hobbitholes

All done! Comments are appreciated :)