Fixing this is incredibly easy with this CSS hack!    All you need to do is take the following code and place it in your stylesheet, setting a maximum width for your images:

.postarea img {
max-width: 500px;
height: auto;
}

In the above code snippet, you’ll want to replace postarea with whatever div ID or CLASS your theme uses for the content.   You can also adjust the 500px to the maximum width you’d like for your images to be.

Note: This hack may not work on some versions of Internet Explorer.

You are reading How To: Prevent Images from Being to Large © 2009 | WordPress Hacks | WordPress Directory | WordPress Forums | WordPress eBook

Enjoy writing about WordPress? Get your blog more exposure by joining the WordPress Hacks writing team!

One of the more common issues with embedding a flash object on your home page (or any page for that matter) is that if it is near the navigation and you have CSS drop-down menus, then you may find your drop-down menu getting lost behind the flash object. If you haven’t dealt with this before it can feel like a nightmare, but fortunately it’s a pretty easy fix.

The Problem: You have a CSS based drop-down menu in your navigation and a flash element near it the menus may get “hidden” behind the flash object.

The Solution: Set the z-index of the div holding the flash to 1 and the z-index of the div holding the nav to 2.

In the flash element:

Look for the flash <object> tag and add the following code:

<param name="wmode" value="transparent">

You’ll want to insert this code right below the <param name=”quality” value=”high”> tag and include the code wmode=”transparent” in the flash <embed> tag .

You are reading Fixing CSS Drop-Down Menus That Hide Behind Flash Objects © 2008 | WordPress Hacks | WordPress Directory | WordPress Forums | WordPress eBook

Enjoy writing about WordPress? Get your blog more exposure by joining the WordPress Hacks writing team!

The problem I’ve had with this new setup is that it can cause some problems when trying to float your images due to the new class=”alignleft”, class=”alignright” or class=”aligncentered” elements.  The image will still move, but I’ve found the text won’t wrap properly around the image.

Thanks to a recent post from Sadish over at WP Lover, it looks like this problem can easily be fixed by by adding some code anywhere into your CSS stylesheet:

img.alignleft, div.alignleft {
float:left;
margin:0 0.5em 0.5em 0;
}
img.alignright, div.alignright {
float:right;
margin:0 0 0.5em 0.5em;
}
img.aligncenter, div.aligncenter {
text-align:center;
margin:0 auto;
}

This way the images should float and the text should wrap properly.  Thanks for posting the easy fix Sadish!

You are reading WordPress 2.6 Changes How WordPress Handles Images © 2008 | WordPress Hacks | WordPress Directory | WordPress Forums | WordPress eBook

Enjoy writing about WordPress? Get your blog more exposure by joining the WordPress Hacks writing team!

In his post, Douglas shows you how to take the following image and convert the icons into individual links:

Once down following the steps that Douglas provides, you will have one image that people can use to subscribe to your RSS feed, request e-mail updates, or get your mobile feed.

Great guide Douglas!

You are reading How To: Create a CSS Image Map © 2007 | WordPress Hacks | WordPress Directory | WordPress Forums | WordPress eBook

Enjoy writing about WordPress? Get your blog more exposure by joining the WordPress Hacks writing team!