ThemeShaper Forums » Thematic

Child theme can't override 2c-r-fixed.css

(12 posts)
  • Started 11 years ago by thinkingsam
  • Latest reply from thinkingsam
  • This topic is resolved
  1. thinkingsam
    Member

    Hey guys, I'm having immense difficulty getting my child theme to override parent theme files. For example, I have .main-aside {width: 270px;} in my child theme's stylesheet, but using firebug I see

    .main-aside {
    float:right;
    position:relative;
    right:10px;
    width:300px;
    }

    on 2c-r-fixed.css.

    Would really appreciate some help on this. My domain is thinkingpoetry.com

    Posted 11 years ago #
  2. amygail
    Member

    hmmm
    try

    .main-aside{
    width: 270px ! important;
    }

    I usually just copy the layout css to my child theme folder and make my changes there.

    Posted 11 years ago #
  3. thinkingsam
    Member

    nope, !important doesn't work...

    Posted 11 years ago #
  4. Works here without !important and without any problem.

    Could you please try one thing?

    Exchange the line

    @import "../thematic/style.css";

    against:

    /* Reset browser defaults */
    @import url('../thematic/library/styles/reset.css');
    
    /* Apply basic typography styles */
    @import url('../thematic/library/styles/typography.css');
    
    /* Apply a basic layout */
    @import url('../thematic/library/layouts/2c-r-fixed.css');
    
    /* Apply basic image styles */
    @import url('../thematic/library/styles/images.css');
    
    /* Apply default theme styles and colors */
    /* It's better to actually copy over default.css into this file (or link to a copy in your child theme) if you're going to do anything outrageous */
    @import url('../thematic/library/styles/default.css');
    
    /* Prepare theme for plugins */
    @import url('../thematic/library/styles/plugins.css');

    Chris

    Posted 11 years ago #
  5. thinkingsam
    Member

    Thanks for the reply, Chris.

    Doing that doesn't work. I'm still seeing

    .main-aside {
    float:right;
    position:relative;
    right:10px;
    width:300px;
    }

    on firebug, even though I have .main-aside {width: 270px;} in my child theme stylesheet, along with the code you suggested.

    Posted 11 years ago #
  6. It looks like it's the order of your stylesheets. I see style.css as the first stylesheet you load in the header. It needs to be the last. Just move it to the bottom and that should fix it... I think...

    Posted 11 years ago #
  7. thinkingsam
    Member

    hi travismallen! how do I do that? by editing header.php?

    Posted 11 years ago #
  8. Here's what I would do:

    1. remove the @imports from the beginning of style.css.

    2. create a function to insert all the stylesheets in funtions.php

    copy paste this...

    <?php
    
    function childtheme_create_stylesheet() {
    	$templatedir = get_bloginfo('template_directory');
    	$stylesheetdir = get_bloginfo('stylesheet_directory');
    	?>
    	<link rel="stylesheet" type="text/css" href="<?php echo $templatedir ?>/library/styles/reset.css" />
    	<link rel="stylesheet" type="text/css" href="<?php echo $templatedir ?>/library/styles/typography.css" />
    	<link rel="stylesheet" type="text/css" href="<?php echo $templatedir ?>/library/styles/images.css" />
    	<link rel="stylesheet" type="text/css" href="<?php echo $templatedir ?>/library/styles/default.css" />
    	<link rel="stylesheet" type="text/css" href="<?php echo $templatedir ?>/library/layouts/2c-r-fixed.css" />
    	<link rel="stylesheet" type="text/css" href="<?php echo $templatedir ?>/library/styles/18px.css" />
    	<link rel="stylesheet" type="text/css" href="<?php echo $stylesheetdir ?>/style.css" />
    
    	<?php
    }
    add_filter('thematic_create_stylesheet', 'childtheme_create_stylesheet');
    ?>

    Give that a try. It should insert the stylesheet links in the header in the right order.

    Posted 11 years ago #
  9. thinkingsam
    Member

    hi travis, thanks for the suggestion, but it still doesn't work.

    i added those lines to functions.php, removed @import from the stylesheet, and cleared cache, but the child theme still can't override the aside width..

    Posted 11 years ago #
  10. thinkingsam
    Member

    anyone have suggestions for this overriding problem? i'm thinking of simply changing the thematic stylesheet directly but I'm leaving that as the last resort...

    Posted 11 years ago #
  11. amygail
    Member

    I would just copy the layout css to your child theme's directory and make the changes there.
    (that's what I do)

    - don't forget to change the path to the file in your style.css

    Posted 11 years ago #
  12. thinkingsam
    Member

    problem resolved! it was an error in my css coding =/ thanks for the help guys

    Posted 11 years ago #

RSS feed for this topic

Reply

You must log in to post.