Fix wordpress smilies problem when styling images
This entry was posted by nhc on Monday, August 18th, 2008 at 3:26 pm. It is filed under Wordpress Tutorials and tagged with css, image, smiley, wordpress.
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 
You've read the post. What's next?
If you like this post then please consider subscribing to our RSS feed. You can also subscribe by email to receive free updates directly in your inbox.
Want to know what am I doing? Follow me on Twitter!
simple css stuff but useful for newbies
thanks
I ran into a wall trying to fix my smilies themer, wondering why smilies was showing up in some post’s and not in others, first I thought there was a plugin conflict then after brainstoring, or o.k I didn’t brain storm too long, I jumped over to the big “G” and found this useful fix. Thanks Much!
http://www.megaonlineprofits.com
Hi there,
This is the real benefit if Cascading Style Sheet. If you know bit programming, this is called inheritance. The lower classes can inherit from upper classes and yet have its unique identity.
Without CSS, you have to define style for each element.
But personally, I prefer to have a zereo margin for my images and if I need margin for specif Image I edit the iamge properties in the post
Cheers..
NHC,
The right sidebars are blank when the post exceeds the range of the sidebar. For eg. The right side of this comment is blank. Can you suggest a fix for that so that the sidebars extend till the bottom irrespective of the content in the sidebar..?
I have the same problem too.