Title: overriding parent css
Last modified: August 22, 2016

---

# overriding parent css

 *  [kitchup](https://wordpress.org/support/users/kitchup/)
 * (@kitchup)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/overriding-parent-css/)
 * Hi,
    I created a child theme called Simone Child by creating a new folder within
   the theme. Then I created a new style.css and have the following:
 * /*
    Theme Name: Simone Child Description: Simone Child Theme Author: K T Template:
   simone Version: 1.0.0 Tags: responsive-layout, accessibility-ready */
 * [@import](https://wordpress.org/support/users/import/) url(“../simone/style.css”);
 * /* =Theme customization starts here
    ————————————————————– */
 * I then add my styles below that. For example, I’ve made some css change on the
   title-box class, I then view the code in Firebug. Realized my css is before the
   parent for some reason? So it’s keeps overriding mine.
 * Please kindly shed me some light on this? Greatly appreciated.
 * Thanks.

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

 *  [stephencottontail](https://wordpress.org/support/users/stephencottontail/)
 * (@stephencottontail)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/overriding-parent-css/#post-5400176)
 * Can you post a link to your site?
 *  Thread Starter [kitchup](https://wordpress.org/support/users/kitchup/)
 * (@kitchup)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/overriding-parent-css/#post-5400178)
 * [http://s1076174.instanturl.net/](http://s1076174.instanturl.net/)
 * So any custom ones will load just fine but existing class in Parent will not 
   be override.
 * Thanks in advance!
 *  [stephencottontail](https://wordpress.org/support/users/stephencottontail/)
 * (@stephencottontail)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/overriding-parent-css/#post-5400181)
 * It seems to be working fine. Can you post a specific CSS rule that isn’t working
   correctly?
 *  Thread Starter [kitchup](https://wordpress.org/support/users/kitchup/)
 * (@kitchup)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/overriding-parent-css/#post-5400209)
 * Hi Stephen,
 * .entry-content for example, i made it width: 108rem but it got override.
 * Under Firebug, you will see .title-box is rendering twice, first mine, so it 
   will take the property like background-color, positioning, text-align, etc. But
   then right after, it will render again and it will do the border and padding 
   which I DO NOT want any of them.
 * Thanks.
 *  Thread Starter [kitchup](https://wordpress.org/support/users/kitchup/)
 * (@kitchup)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/overriding-parent-css/#post-5400210)
 * And as I was thinking, for the style that was declare on the Parent that I don’t
   want, would I have to do something like:
 * padding: initial;
    border: initial;
 * To get rid of them?
 * But what happen to .entry-content? Why does it get override?
 *  [stephencottontail](https://wordpress.org/support/users/stephencottontail/)
 * (@stephencottontail)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/overriding-parent-css/#post-5400220)
 * For your `.title-box`, you would have to explicitly override the border and padding
   with something like this:
 *     ```
       .title-box {
       line-height: 130%;
       position: absolute;
       right: 0;
       text-align: right;
       top: 20px;
       background-color: red;
       border: none;
       padding: 5px;
       }
       ```
   
 * And as for `.entry-content`, the max-width on that is set in another stylesheet,`
   content-sidebar.css`, that’s loaded after your child theme’s stylesheet. A dirty
   fix would be to use `!important`:
 *     ```
       .entry-content {
       max-width:108rem !important;
       }
       ```
   
 *  Thread Starter [kitchup](https://wordpress.org/support/users/kitchup/)
 * (@kitchup)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/overriding-parent-css/#post-5400238)
 * Any other solution than !important? I really wouldn’t want to unless it’s impossible.
   
   And thanks for your previous response.
 *  [stephencottontail](https://wordpress.org/support/users/stephencottontail/)
 * (@stephencottontail)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/overriding-parent-css/#post-5400240)
 * Try something like:
 *     ```
       article .entry-content{
       max-width:108rem;
       }
       ```
   
 * That would give you more specificity.

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

The topic ‘overriding parent css’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/simone/2.1.5/screenshot.png)
 * Simone
 * [Support Threads](https://wordpress.org/support/theme/simone/)
 * [Active Topics](https://wordpress.org/support/theme/simone/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/simone/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/simone/reviews/)

## Tags

 * [child theme](https://wordpress.org/support/topic-tag/child-theme/)

 * 8 replies
 * 2 participants
 * Last reply from: [stephencottontail](https://wordpress.org/support/users/stephencottontail/)
 * Last activity: [11 years, 7 months ago](https://wordpress.org/support/topic/overriding-parent-css/#post-5400240)
 * Status: not resolved