Fix wordpress smilies problem when styling images

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

Wordpress smileys">

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