Quick CSS for WordPress Images

CSS Hints HOWTOs HTML/XTML jappler.com Web Development WordPress

If you install WordPress and use the media uploader to manage your images in your posts – you can easily style your images quickly by adding the following code to your theme’s stylesheet.

img.alignright, img.aligncenter, img.alignleft {padding:4px;background:#efefef;border-color: #aaa #ccc #ddd #bbb;border-style: solid;border-width: 1px;}
img.alignright {float:right;margin-left:5px;}
img.alignleft, img.alignnone {float:left;margin-right:5px;}
img.aligncenter {display: block;margin-left: auto;margin-right: auto;}

This code will set up your images to float appropriately, as well as give a nice border as seen below.

Note* This information is now updated: Updated CSS

3 thoughts on “Quick CSS for WordPress Images”

  1. Rasmuw Hill

    I have been blogging for since january 2009 and had to learn

    a lot of things through trial and error. I am currently

    reading to your training blog and finding it to be very informative.

    For anyone that is thinking of starting a training blog I highly recommend this is a good one.

Leave a Reply

Your email address will not be published.
*
*

This site uses Akismet to reduce spam. Learn how your comment data is processed.

CSS HOWTOs HTML/XTML Javascript Web Development

jQuery + CSS + XHTML = Jappler Menus v2

Previously – I introduced a nice way to create drop down menus using HTML (lists), Javascript (drop down), and CSS (styling of menu). I put all of this together and called it: Jappler Menus. (See previous post about Jappler Menus). Since writing that post – I have found a better, faster, cleaner way to work […]

Apple Serenity Now!

Seriously Apple – Find an iMovie Interface and Stick to It

Wow. How many times will Apple release a new version of iMovie and completely change the interface and how it works? I cannot tell you how many versions now I have used of iMovie that were completely different than the previous. Each time I have to either waste an hour or so to figure out […]