PSD to HTML conversion PSD to HTML conversion PSD2HTML.com with over 300 professionals takes the designs to HTML and beyond

Code Snippet

Home » Code Snippets » WordPress » Base Threaded Comments Styling

Base Threaded Comments Styling

ol.commentlist { list-style:none; margin:0 0 1em; padding:0; text-indent:0; }
ol.commentlist li { }
ol.commentlist li.alt { }
ol.commentlist li.bypostauthor {}
ol.commentlist li.byuser {}
ol.commentlist li.comment-author-admin {}
ol.commentlist li.comment { border-bottom:1px dotted #666; padding:1em; }
ol.commentlist li.comment div.comment-author {}
ol.commentlist li.comment div.vcard { font:normal 16px georgia,times,serif; }
ol.commentlist li.comment div.vcard cite.fn { font-style:normal; }
ol.commentlist li.comment div.vcard cite.fn a.url {}
ol.commentlist li.comment div.vcard img.avatar { border:5px solid #ccc; float:right; margin:0 0 1em 1em; }
ol.commentlist li.comment div.vcard img.avatar-32 {}
ol.commentlist li.comment div.vcard img.photo {}
ol.commentlist li.comment div.vcard span.says {}
ol.commentlist li.comment div.commentmetadata {}
ol.commentlist li.comment div.comment-meta { font-size:9px; }
ol.commentlist li.comment div.comment-meta a { color:#ccc; }
ol.commentlist li.comment p { font-size:11px; margin:0 0 1em; }
ol.commentlist li.comment ul { font-size:11px; list-style:square; margin:0 0 1em 2em; }
ol.commentlist li.comment div.reply { font-size:11px; }
ol.commentlist li.comment div.reply a { font-weight:bold; }
ol.commentlist li.comment ul.children { list-style:none; margin:1em 0 0; text-indent:0; }
ol.commentlist li.comment ul.children li {}
ol.commentlist li.comment ul.children li.alt {}
ol.commentlist li.comment ul.children li.bypostauthor {}
ol.commentlist li.comment ul.children li.byuser {}
ol.commentlist li.comment ul.children li.comment {}
ol.commentlist li.comment ul.children li.comment-author-admin {}
ol.commentlist li.comment ul.children li.depth-2 { border-left:5px solid #555; margin:0 0 .25em .25em; }
ol.commentlist li.comment ul.children li.depth-3 { border-left:5px solid #999; margin:0 0 .25em .25em; }
ol.commentlist li.comment ul.children li.depth-4 { border-left:5px solid #bbb; margin:0 0 .25em .25em; }
ol.commentlist li.comment ul.children li.depth-5 {}
ol.commentlist li.comment ul.children li.odd {}
ol.commentlist li.even { background:#fff; }
ol.commentlist li.odd { background:#f6f6f6; }
ol.commentlist li.parent { border-left:5px solid #111; }
ol.commentlist li.thread-alt { }
ol.commentlist li.thread-even {}
ol.commentlist li.thread-odd {}

Reference URL

Subscribe to The Thread

  1. RobertG says:
    12/04/2009 at 4:07 pm

    That was very useful piece of code, thanks for sharing!

    Reply
  2. Brandon says:
    01/05/2010 at 11:54 am

    Thanks this was a sweet helper!

    Reply
  3. eric says:
    06/18/2010 at 7:39 am

    I use this article ALL the time… but I finally had use this one w/ it:
    http://www.scriptygoddess.com/archives/2009/01/15/wordpress-wp_list_comments/

    Reply
  4. Tice says:
    01/04/2011 at 12:00 am

    Even that I don’t use WordPress – well done!

    Reply
  5. IT Rush says:
    03/12/2011 at 3:30 am

    Wow, this could be very helpful.. hope to apply it right away.

    Reply
  6. Markus says:
    04/15/2011 at 10:15 am

    Thanks for the informtaionen

    Reply
  7. Andriy Skorbatuyk says:
    06/10/2011 at 6:13 am

    Thanks. This part of code is difficult.

    Reply
  8. Rabih says:
    06/22/2011 at 4:25 am

    You saved me a lot of time! thanks a lot!

    Reply

Speak, my friend

At this moment, you have an awesome opportunity* to be the person your mother always wanted you to be: kind, helpful, and smart. Do that, and we'll give you a big ol' gold star for the day (literally).

Posting tips:
  • You can use basic HTML
  • When posting code, please turn all
    < characters into &lt;
  • If the code is multi-line, use
    <pre><code></code></pre>
Thank you,
~ The Management ~