WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] IE7 (yes, you heard me) and captions (5 posts)

  1. ksteingrandt
    Member
    Posted 2 years ago #

    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!

  2. kmessinger
    Volunteer Moderator
    Posted 2 years ago #

    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;
    }

  3. ksteingrandt
    Member
    Posted 2 years ago #

    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.

  4. kmessinger
    Volunteer Moderator
    Posted 2 years ago #

    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.

  5. ksteingrandt
    Member
    Posted 2 years ago #

    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!

Topic Closed

This topic has been closed to new replies.

About this Topic