WPGarage.com

New CSS for aligning images, block elements and captions

I was recently working on a WordPress site, and I just couldn’t get my images to left-align with the text so that the text would wrap around it. It was wrapping in the text editor in the admin, but on the front end the image stuck out of the top of the text.

Rebecca, our genius Web Project Manager at illuminea, did a search and discovered on the WordPress Codex that a bunch of new styles are needed in your style.php file in order to get the images to do what you want from WordPress version 2.5 and up. If you are using an older theme, you may not have these styles in your style sheet. The same classes are used to align images that have a caption (as of WordPress 2.6).

Here are the styles – you can just copy and paste them into your style.css file or wherever your CSS styles are located:

.aligncenter,
div.aligncenter {
   display: block;
   margin-left: auto;
   margin-right: auto;
}

.alignleft {
   float: left;
}

.alignright {
   float: right;
}

.wp-caption {
   border: 1px solid #ddd;
   text-align: center;
   background-color: #f3f3f3;
   padding-top: 4px;
   margin: 10px;
   /* optional rounded corners for browsers that support it */
   -moz-border-radius: 3px;
   -khtml-border-radius: 3px;
   -webkit-border-radius: 3px;
   border-radius: 3px;
}

.wp-caption img {
   margin: 0;
   padding: 0;
   border: 0 none;
}

.wp-caption p.wp-caption-text {
   font-size: 11px;
   line-height: 17px;
   padding: 0 4px 5px;
   margin: 0;
}

Posted in CSS | Tags: captions, Images, upgrades | 15 Comments »

WordPress 2.7 heavily based on existing plugins

Weblog Tools Collection has published an overview of the features in store for us in WordPress 2.7. As I was reading the list, I noticed that many of them them are based on existing popular plugins, like the Google Sitemaps Generator, Better Comments Manager, YATCP (Yet Another Threaded Comments Plugin), and Subscribe to Comments.

I had mixed feelings about this: on the one hand, these plugin authors had enough vision to see a need and fill it with some plugins that became standards for experienced WordPress blog developers. If WordPress makes these features part of the core, than these plugins become legacy and are no longer needed, and all the developers will no longer get recognition for their innovation and leadership in the WordPress community.

On the other hand, these types of developments are par for the course in an open source community, and is what makes the WordPress software so fantastic. The people at Automattic give free rein to the community to develop new features, and then these features are tested by thousands around the world over many years, and “survival of the fittest” helps the community identify the best and most important features to be added to the WordPress core.

The result: one of the best pieces of open source software around, and a celebration of the culture of open source.

What do you think?

Posted in News & Views | Tags: Automattic, open source, upgrades | 22 Comments »