Image cut-outs(css style) to make icon display

I am on the development side only when it comes to web portals and all, but many of time i have been asked to do some adjustment in CSS (which i feel undesirable, as i am not even OK in it) and some time these web browser behave in a naughty way

So to the issue to tackle is : How to use small images in icons as small icons are sometimes not loaded in IE (you have to pre load them and things like that in javascript)

and the answer is hidden in CSS (i recently came to know about it and implemented my self)

well for this the prerequisites is to have a images with many small icons inside it like this

and a css style class with something like

.icons {

background-image:url(/images/icon_collection.png);

background-repeat:no-repeat;

display:block;

height:18px;

margin-left:10px;

margin-right:6px;

width:18px;

}

.icon_one {

background-position:-156px -83px;

}

and apply it on div like this

<div class="icons icon_one"> </div>

so that can give result like this ...

point to note is

background-position:x-pos y-pos;

:) happy cssing

Customized collage from picasa3

Hello world,

This time nothing from the coding side :) . I am just sharing a quicky of a new advanced feature from picasa3… and that is one can customize collage while creating it.

First and foremost thing is that many are not even known to picasa and those of you are aware of it is not aware of its making collage feature and those of you are aware must have noticed it that picasa although use to provide the facility of making a collage but nothing more than that (at max user has the option to randomize the snaps and nothing more), well that was the story of Picasa2.

But good news guys, drawing board has changed and now you are in full control of what you want to show and how to show and how much to show.. an all thanks to picasa3