Treehouse: Grow your CSS skills. Land your dream job.

[Solved] CSS and the WordPress Sandbox Theme

  • # June 11, 2010 at 8:25 pm


    Ok so I have this that works..

    html: <div class="comment-meta">Posted June 11, 2010 at 9:25 am <span class="meta-sep">|</span> <a href="#comment-1" title="Permalink to this comment">Permalink</a>

    css: .comment-meta .meta-sep {color:red; }

    And this doesn’t work.. Can’t understand why.

    html: <li id="comment-2" class="comment c1 c-y2010 c-m06 c-d11 c-h17">
    <div class="comment-author vcard"><img alt="" src=";;r=G&quot; class="photo avatar avatar-50 photo" width="50" height="50"> <span class="fn n">Paul</span></div>
    <div class="comment-meta">Posted June 11, 2010 at 5:50 pm <span class="meta-sep">|</span> <a href="#comment-2" title="Permalink to this comment">Permalink</a> <span class="meta-sep">|</span> <span class="edit-link"><a class="comment-edit-link" href=";c=2&quot; title="Edit comment">Edit</a></span></div>


    css: .comment-author vcard .fn n {color:red; }

    I am looking to style the .fn n, but cant hook it
    Ill be back tomorrow, if you guys need more- off to bed now.


    # June 11, 2010 at 11:45 pm

    The first could be from not closing the div but I guess that is just how you posted it here. Could be an inheritance problem so the rest of the CSS would matter.

    The second… You did not put the dot in front of the n declaration in the CSS and n does not cascade from fn, they are siblings. So just target n or fn and not .fn .n

    I have not tested these but you can try.

    # June 12, 2010 at 3:29 am

    thank you very much
    I didn’t realise it was two styles together, looking at it too long.
    The unclosed div was as you thought just the way I posted.
    It works now with.
    css: .n

    Solved Cheers


    # June 21, 2010 at 6:27 pm


Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.