• Resolved Robert

    (@clritym)


    After creating a child theme and customising the style sheet and adding a header image it suddenly reverted back to the original style in some parts and kept the custom style in other parts, I have no idea how this happened….. Anyone have any ideas? theme is twenty thirteen.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Child theme stylesheet is meant for adding changes overwriting some parts of parent styles, that’s why the @import line at the top. Changes made to the same selector declared down below will overwrite parent’s style.

    Assuming your child theme stylesheet is valid, no syntax errors, whatever CSS declared will be used instead of parent’s, unless the selector has less specificity to one used in parent.

    CSS Specificity
    http://reference.sitepoint.com/css/specificity

    Thread Starter Robert

    (@clritym)

    Yeah, that’s what I has done, have imported style sheet and customised part’s of it, it was all fine everything was how I wanted it in the child theme css and was showing up perfectly, then did a refresh and half of the styles reverted back to the parent style sheet, check the child style and nothing was different, all styles were exactly the same as before, when it was working, now I don’t know how to get it back to overriding parent style sheet with child style sheet,or even if that’s the issue as the template is taking some of the parent style sheet and some of hte child style sheet.

    Can give example:
    Parent:

    .widget {
    	background-color: rgba(247, 245, 231, 0.7);
    	font-size: 14px;
    	-webkit-hyphens: auto;
    	-moz-hyphens:    auto;
    	-ms-hyphens:     auto;
    	hyphens:         auto;
    	margin: 0 0 24px;
    	padding: 20px;
    	word-wrap: break-word;
    }

    Child:

    .widget {
    	background: #fcfcfc; /* Old browsers */
    	background: -moz-radial-gradient(center, ellipse cover,  #fcfcfc 0%, #f2f2f2 100%); /* FF3.6+ */
    	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#fcfcfc), color-stop(100%,#f2f2f2)); /* Chrome,Safari4+ */
    	background: -webkit-radial-gradient(center, ellipse cover,  #fcfcfc 0%,#f2f2f2 100%); /* Chrome10+,Safari5.1+ */
    	background: -o-radial-gradient(center, ellipse cover,  #fcfcfc 0%,#f2f2f2 100%); /* Opera 12+ */
    	background: -ms-radial-gradient(center, ellipse cover,  #fcfcfc 0%,#f2f2f2 100%); /* IE10+ */
    	background: radial-gradient(ellipse at center,  #fcfcfc 0%,#f2f2f2 100%); /* W3C */
    	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#f2f2f2',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    	font-size: 14px;
    	-webkit-hyphens: auto;
    	-moz-hyphens:    auto;
    	-ms-hyphens:     auto;
    	hyphens:         auto;
    	margin: 0 0 24px;
    	padding: 20px;
    	word-wrap: break-word;
    }

    and it’s taking the parent theme style sheet instead.

    in this one it’s doing what it’s suppose to do and taking the child theme style sheet:
    Parent:

    .site-header .home-link {
    	color: #141412;
    	display: block;
    	margin: 0 auto;
    	max-width: 1080px;
    	min-height: 230px;
    	padding: 0 20px;
    	text-decoration: none;
    	width: 100%;
    }
    
    .site-header .home-link {
    	color: rgb(128,128,128);
    	display: block;
    	margin: 0 auto;
    	max-width: 1080px;
    	min-height: 150px;
    	padding: 0 20px;
    	text-decoration: none;
    	width: 100%;
    }


    [Code corrected by moderator]

    So I don’t know what the issue is, because it was all working fine, the way it’s suppoe to with the child theme overriding the parent, then after a refresh only half of the child stylesheet is being used.

    Have you checked for CSS errors in your child theme?

    http://jigsaw.w3.org/css-validator/

    Also, it’s really impossible to help specifically without seeing your site.

    Please also be sure to use the backticks or code buttons when posting code here – http://codex.wordpress.org/Forum_Welcome#Posting_Code

    Thread Starter Robert

    (@clritym)

    —–Found the fix—– one } wsa missing, don’t know how I deleted that, but that was the only thing missing, after going through all the code. It’s sorted now, thanks.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Child them showing only half of the customizations’ is closed to new replies.