Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #10092

    When inserting a photo with a caption with anything less than “full size” selected, extra whitespace (padding?) is created on the right between the image boundary and the caption border. I thought I saw this come up before but could not find it mentioned on the forum.

    You can see it on the theme demo, on the blog page titled “HTML Styles” – the paragraph titled “Image align left with caption.”

    Is there a fix for this, or one planned? I can get by without using it for now, but I’d like to use a caption in some of my photos.

    Great theme btw, I am new to WP and not a code person and with patience have had no problems getting my site set up.

    Thanks,

    Kim

    #66836

    Hi Kim,

    Thanks for the heads up. I’m not sure whats adding the hard coded extra width but I’ll tag this for Kriesi to take a look at.

    #66837

    Hey!

    add this to your custom.css stylesheet in folder /css/ or to the quick-css panel located in your wordpress backend at angular->styling:


    #top .wp-caption img {
    padding: 5px;
    }

    that should fix the issue. we will add it to the next update as well ;)

    #66838

    Thanks for the quick reply.

    That worked fine for the smaller images, but it forced a full size image to spill over the right side border:

    http://1159studio.com/2012/02/08/yet-another-test-post/

    Kim

    #66839

    Hi!

    hm tricky. I think we will need to use an advanced css3 feature to fix that:


    #top .wp-caption img {
    padding: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    }

    should do it

    Best regards,

    Kriesi

    #66840

    Well…

    You can see there is now extra padding on the right on smaller images. Full size is fine. Seems correcting one messes up the other.

    http://1159studio.com/2012/02/08/yet-another-test-post/

    Kim

    #66841

    gnarr ;D

    hm seems there is no universal rule that works for all image sizes so we need to use the classnames that are applied via wordpress.

    the fullsize image got the classname .size-full

    therefore I would propose the following fix:


    #top .wp-caption img {
    padding: 5px;
    }

    #top .wp-caption .size-full {
    padding: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    }

    #66842

    Looks great!

    Thanks for taking care of that so quickly, Christian. Much appreciated!!!

    Cheers,

    Kim

Viewing 8 posts - 1 through 8 (of 8 total)

The topic ‘Photos with caption enabled displaying extra space on right side border’ is closed to new replies.