Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS A little help with selectors

  • This topic is empty.
Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #43901
    tannercampbell
    Participant

    http://codepen.io/TannerCampbell/pen/wjzdL

    Thinking I was being clever, I did this:

    #column-left p {
    font-size: 1.5em;
    line-height: 24px;
    text-align: left;
    padding: ;
    }

    Making all the p tags in the #column-left div adhere to this styling. Well, whoops, because I have a p tag, classed as “comments”, that exists in #column-left and I need to speak to it specifically to adjust its size.

    Anyone know a work around? I can fix it by moving some things around but I was hoping someone might know a clever piece of CSS that would allow me void the other styling.

    If you want to see the site instead of the code pen: http://tannercampbell.net/writerssquare

    any input would be appreciated. Thanks, all.

    Best,
    Tanner

    #130714
    chrisburton
    Participant

    Target `#column-left .comments`?

    #130753
    chrisburton
    Participant

    Actually that’s weird. That should have worked for you.

    `p.comments` is the same same as `

    `

    #130760
    chrisburton
    Participant

    That depends if you’re using `!important` and if `#column-left p` is below `#column-left p.comments` in your stylesheet, I believe.

    #130763
    wolfcry911
    Participant

    The order doesn’t matter

    #column-left .comment { } (or p.comment)

    has a higher specificity than

    #column-left p { }

    and will win out over the general level p

    #130764
    chrisburton
    Participant

    Thanks @wolfcry911

    #130783
    wolfcry911
    Participant

    LOL – thanks tanner, you made my day!

    And just for the record (for those that care), I never claim to know everything about anything ;)

Viewing 7 posts - 1 through 7 (of 7 total)
  • The forum ‘CSS’ is closed to new topics and replies.