This question is an offshoot from the this discussion on removing dimension attributes from images. The solution code provided on that thread works very well except that it has the unfortunate side effect that any [caption] shortcodes are striped from the image.

After several hours of digging through the core code, I found the cause of this. The wpeditimage TinyMCE plugin that's responsible for adding the [caption] shortcode checks for width attributes in the shortcode and the img tag. If it doesn't find them, it simply remove the caption. Since, this is done 'on the fly' with javascript in the TinyMCE editor, I can't think of any type of WordPress filter that would address this issue. I would be very happy to be proven wrong however. :)

As a final note, my temporary solution has been to use the following jQuery to strip all of the offending tags client side. This, in conjunction with a filter on img_caption_shortcode to prevent a width style from being used there, seems to do the job. It's not pretty, but it's a band-aid for now. Anyone have a better idea?

// Strip width and height attributes from img, video, and object in the main article so we can have fluid images
var $fluid_items = $('.main-article-wrapper').find('img,video,object');
  • Hmmm... is being able to use the visual editor a requirement? If you only use the HTML editor, a filter on img_caption_shortcode works fine... Commented Nov 6, 2011 at 14:10
  • @goldenapples, yeah, I don't want to loose the visual editor as I am going to be having non-technical people edit the site. Thanks for the suggestion though. Any other ideas?
    – Dominic P
    Commented Nov 8, 2011 at 0:36
  • Dominic, can you provide the code for "a filter on img_caption_shortcode to prevent a width style from being used there"? This is exactly what I need, but I don't know how to write that filter.
    – user11197
    Commented Dec 16, 2011 at 15:15
  • @Wendy, hmm, I can't paste the whole thing in a comment. If you want to ask another question and give me a link to it, I'll post it as answer.
    – Dominic P
    Commented Dec 18, 2011 at 22:51
  • In case you didn't want to go through all of that, I basically just modified the Codex example.
    – Dominic P
    Commented Dec 18, 2011 at 22:58

1 Answer 1


it might not be the exact answer you're after but i think i just found a pretty good workaround.

Iv'e taken the following code from the twenty-eleven theme CSS (who's neatly responsive imho):

/* Images */
.entry-content img,
.comment-content img,
.widget img {
    max-width: 97.5%; /* Fluid images for posts, comments, and widgets */
img[class*="wp-image-"] {
    height: auto; /* Make sure images with WordPress-added height and width >attributes are scaled correctly */
img.size-full {
    max-width: 97.5%;
    width: auto; /* Prevent stretching of full-size images with height and >>width attributes in IE8 */

This was enuff to make all the images responsive (at least those embedded in the content...) Now i have responsive images, but when caption is used i still have the same problem, that occurs because the tinyMCE adds a style attribute to the caption container with the image's width. To fix that all i had to do is add this to my CSS:

            .wp-caption { max-width: 100%; }

Done! works fine for me, although it might not work for featured images.

I hope this helps someone :-)

  • I haven't had the time to test this fully yet, but it's already proved quite useful in other areas. Thanks for the help.
    – Dominic P
    Commented Feb 21, 2012 at 6:45
  • my pleasure :-)
    – Talbatz
    Commented Feb 22, 2012 at 11:19
  • Tested it in IE9, doesnt seem to work as intended! Commented Jun 24, 2013 at 11:16
  • This conflicts with the old IE browsers
    – Tosh
    Commented Jun 23, 2014 at 10:29
  • really great solution! thx
    – emjay
    Commented Oct 26, 2015 at 11:53

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.