Skip to content

Styling Images in WordPress

There’s some good advice on styling images in WordPress over on Pearson’s Cutline Theme*.

I’m glad you asked! Cutline has been constructed so that images that do not have classes applied to them will still be styled. In fact, they’ll receive the same styling as any image that receives the right class, meaning that the image will be right-aligned with a frame. Oh, and text will wrap around the image, just like it does here. See? You don’t even have to go out of your way to be fancy with Cutline, and that’s how we like it.
Update: As of September 28th, 2006, Cutline has been revised so that unstyled images no longer receive default styling. This is a move that I hated to make on many fronts, but I also realize that it’s just really inconvenient to have every image styled by default.

It’s not that tough to add a class to an image tag however. I much prefer my system built on wrapping the image in an h5 tag, and styling the h5. Here’s an example.

Anne Schmitt

Why? This way you can add centred captions to your image.

Syntax is h5 > a href > img > close a href > br > text > close h5.

CSS for the above is:

div.entry h5 {font-size: 10px; font-weight: normal;
margin: 0; padding: 0; margin-left: 4px; text-align: center; clear: both;}

h5 img {}

div.entry h5 a, div.entry h5 a:visited, div.entry h5 a:hover
{text-decoration: none; color: black;}

Highly recommended.

*Unlike most people, I actually really dislike this theme and find it quite primitive. I suppose that makes it a better starting point for somebody wishing to build something more sophisticated.

Leave a Reply

Your email address will not be published. Required fields are marked *