• Resolved midstatelitho

    (@midstatelitho)


    I’ve created a custom template (based on classic) to match our existing site. I’d be happy to share a link if it will help but I’m pretty sure I’ve narrowed down my problem.

    When I attach an image and apply a caption to it, the div for the caption seems to add a 10px margin which throws off the entire layout.

    My column width is 380, and the attached image itself is 380. The div for the caption that surrounds the image has a style attribute that has a width of 390. Now I cannot figure out where this number 390 is coming from. Here’s the source code I’m getting

    <div id=”attachment_28″ class=”wp-caption alignnone” style=”width: 390px”><img class=”size-medium wp-image-28″ title=”anilox_400″ src=”https://www.midstatelitho.net/articles/wp-content/uploads/2008/11/anilox_400-300×240.jpg&#8221; alt=”Anilox Roller Cells Magnified at 400x” width=”380″ height=”321″ /><p class=”wp-caption-text”>Anilox Roller Cells Magnified at 400x</p></div>

    I’ve searched high and low through my source and can’t seem to find it. It seems strange that the number 390 would be written into the template code so I assume there’s a calculation somewhere in the caption code that is coming up with 390.

    Any ideas?

Viewing 5 replies - 1 through 5 (of 5 total)
  • Thread Starter midstatelitho

    (@midstatelitho)

    line 375 in wp-includes/media.php

    change 10 to 0

    return ‘<div ‘ . $id . ‘class=”wp-caption ‘ . $align . ‘” style=”width: ‘ . (10 + (int) $width) . ‘px”>’

    joelhardi

    (@joelhardi)

    I would unmark this as “resolved” if I were you … to me this “feature” is a bug. This kind of thing shouldn’t be hardcoded deep in a core WP library. It should either be removed entirely (which I would prefer) or be configurable via the Settings (there are already places under the Miscellaneous panel where image thumbnail sizes are set) or as a PHP constant or global you can define in your theme.

    I don’t get why they did this. It’s so easy to just do

    .wp-caption {
    padding: 0 5px 0 5px;
    }

    or whatever to achieve the same visual effect.

    This is annoying in my case because I don’t want this extra gap around my images. The CSS2 spec says you have to define a width for any floated element (the div in this case) so I appreciate what WP is trying to do, I just wish it wouldn’t add the 10px!

    the code actually adds a hardcoded element style width of 10px + the image width to the html:

    style="width: ' . (10 + (int) $width) . 'px"

    so then in your html you have:

    <div style="width: 810px">...</div>

    For every single captioned picture in your site. Which just seems like bad code to me. Stuff like this is what CSS was invented for.

    I took out that whole part, rather than just the 10px padding, and my stuff still looks fine in IE, FF, and Chrome.

    I dont like that +10px thing neither, can someone tell me why they added it, and why they keep it?

    Is like a workaround to something..?

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Attached Image Captions adding 10px’ is closed to new replies.