How can I remove the 10px of added width to WordPress image captions within the tinymce editor?

I’m using a snippet of code to effectively remove the 10px of added width WordPress adds to caption images on the front end of the site. However, it’s still adding 10px in the tinymce editor:

<dl id="attachment_69" class="wp-caption alignleft" style="width: 310px" data-mce-style="width: 310px;">

How can I remove this 10px? I’ve tried modifying the core (bad idea, I know) by changing “10 +” to 0 in a few places, but I’m not having any luck.

Read More

Thanks!

Related posts

Leave a Reply

1 comment

  1. Here’s what we’re using. Put this in the functions.php for your theme.

    // Override img caption shortcode to fix 10px issue.
    add_filter('img_caption_shortcode', 'fix_img_caption_shortcode', 10, 3);
    
    function fix_img_caption_shortcode($val, $attr, $content = null) {
        extract(shortcode_atts(array(
            'id'    => '',
            'align' => '',
            'width' => '',
            'caption' => ''
        ), $attr));
    
        if ( 1 > (int) $width || empty($caption) ) return $val;
    
        return '<div id="' . $id . '" class="wp-caption ' . esc_attr($align) . '" style="width: ' . (0 + (int) $width) . 'px">' . do_shortcode( $content ) . '<p class="wp-caption-text">' . $caption . '</p></div>';
    }
    

    This eliminates the 10px problem altogether and removes the need for workarounds.