Support » Fixing WordPress » IE7 (yes, you heard me) and captions

  • Resolved ksteingrandt

    (@ksteingrandt)


    Hi all

    You did read that subject line correctly – I am in the unenviable position of having to fix some issues with a blog and IE7. Yay!

    We’re using a child theme of Twenty Eleven on 3.3.1 and the image captions are not showing up on IE7. The captions do appear in the source code. The blog is in Chinese, but it doesn’t appear to be an issue with a language pack, because colleagues that have the Chinese language pack installed also can’t see the captions in IE7.

    URL: blogs.socialtest.getusinfo.com/mgck

    First question:
    Do you think this is a stylesheet problem, or a functionality problem?

    Question the second:
    Assuming it’s a stylesheet problem, any ideas on what it could be? Alignment? Margin? Padding?

    Third:
    If a functionality problem, which file do you think I need to dig into to solve this?

    Here are the styles for the captions from my child theme’s style.css

    p img,
    .wp-caption {
    	margin-top: 0.4em;
    }
    .wp-caption {
    	background: #eee;
    	margin-bottom: 1.625em;
    	max-width: 96%;
    	padding: 9px;
    }
    .wp-caption img {
    	display: block;
    	margin: 0 auto;
    	max-width: 98%;
    }
    .wp-caption .wp-caption-text,
    .gallery-caption {
    	color: #666;
    	font-family: Georgia, serif;
    	font-size: 12px;
    }
    .wp-caption .wp-caption-text {
    	margin-bottom: 0.6em;
    	padding: 10px 0 5px 40px;
    	position: relative;
    }
    .wp-caption .wp-caption-text:before {
    	color: #666;
    	content: '\2014';
    	font-size: 14px;
    	font-style: normal;
    	font-weight: bold;
    	margin-right: 5px;
    	position: absolute;
    	left: 10px;
    	top: 7px;
    }

    Thanks all!

Viewing 4 replies - 1 through 4 (of 4 total)
  • Moderator kmessinger

    (@kmessinger)

    Change
    .wp-caption .wp-caption-text {
    margin-bottom: 0.6em;
    padding: 10px 0 5px 40px;
    position: relative;
    }
    to
    .wp-caption .wp-caption-text {
    margin-bottom: 0.6em;
    padding: 10px 0 5px 40px;
    }

    Thanks kmessinger…unfortunately that does not seem to have worked.

    But you’re thinking it is a stylesheet problem? I can keep farting around with the stylesheet until I find the magic bullet, I guess.

    Moderator kmessinger

    (@kmessinger)

    I think css because changing it worked for me in IE web developer tools. You can also use Firebug to drill down to the css that effects captions.

    I got it working. At my wits’ end, I basically took everything from all the classes that had to do with captions and crammed them into the .wp-caption-text class. I have no idea why that worked, but it worked.

    Here’s what it ended up looking like:

    .wp-caption .wp-caption-text {
    	margin-bottom: 0.6em;
    	padding: 10px 0 5px 40px;
    	color: #666;
    	font-style: normal;
    	background: #eee;
    	margin-bottom: 1.625em;
    	max-width: 96%;
    	padding: 9px;
    	font-family: Georgia, serif;
    	font-size: 12px;
    }

    Thanks for the responses!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘IE7 (yes, you heard me) and captions’ is closed to new replies.