Missing image aligning in WP templates

Filed under: , , , , , by: Keym4k3r

While testing various templates for Wordpress sites I have seen one common thing.
The tend to miss some piece of code responsible for image aligning.
Normally, when you insert the image to the post, or page, it has WP option to show left, centered, right or none align.
In some templates the picture shows at the same place, regardless of settings.
To get the correct position, you need to put the following code to style.css file :

p img {
padding: 0;
max-width: 100%;
}


img.centered {
display: block;
margin-left: auto;
margin-right: auto;
}

img.alignright {
padding: 4px;
margin: 0 0 2px 7px;
display: inline;
}

img.alignleft {
padding: 4px;
margin: 0 7px 2px 0;
display: inline;
}

.alignright {
float: right;
}

.alignleft {
float: left
}

Some values can be altered suiting you needs, important are the names of classes.
Cheers!

0 comments: