Fix wordpress smilies problem when styling images

Pictures say a 1000 words. Adding images and style your images are important in your articles in two ways, first they add up in a good look and feel of your article and second it make you gain credibility as an author. But you should be aware of the problem with smileys …

Problem

You might use these CSS code to style images in your entries :
.entry img {
margin:10px;
padding:10px;
border:1px solid silver;
}

Yeah, it is fine. Those code make your images more beautiful, but wait … This would affect your smiley images too! Look at the image below

Your smiley images is added 10px margin, 10px padding, 1px silver border. And therefore it is not good looking

How to fix

The smiley images in WordPress are automatically given a CSS class of wp-smiley when they are displayed in a post. You can use this class to style your smileys differently from other post images.
You could add these code to your CSS :
img.wp-smiley {
margin:0px;
padding:0px;
border:0px;
}

That’s all