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 {}
Base Threaded Comments Styling
Chris Coyier
on
That was very useful piece of code, thanks for sharing!
gg
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/
Wow, this could be very helpful.. hope to apply it right away.
same here!
jangan biarkan kulit keriput, jerawat dan bisul-bisul mengganggu penampilan anda, segera obati dengan gluta drink.
manfaat susu gluta drink sudah terbukti nyata dan gluta drink yang asli hanya bisa anda dapatkan di
distributor gluta drink yogyakarta
Thanks for the informtaionen
Thanks. This part of code is difficult.
You saved me a lot of time! thanks a lot!
The other day I made a question regarding how you make such beautiful comments section…. I have just found out a little on modyfing text boxes and text inputs…
Thanks a lot!!!
Great post, really usefull
as always, an extremely helpful and straight forward example that is highly customisable.
You sir… are a legend!
Even being experienced with front side development, the threaded comments was pretty tricky to get a handle on.
hi, i need a beautiful, eye-catching style for the comments on my forum,
just the style, not any programming code, any suggestion??
Chris,
Based upon your CSS here, I quickly whipped up a nice clean SCSS version of your WordPress comment styling for those who need it. Check it out over @ https://gist.github.com/4391954
Can some one please help me style the comment form for WordPress in a way that is similar to on this site? The form will not fit appropriately on the page and i am getting frustrated any help will be greatly appreciated.
i want to ask that i was also trying to do threaded comments in wordpress, i coded it but it still appears in same line not in threaded form.But when i styled it with your given css it works and shows in threaded style.So my question is that styling is also required for threaded comments with coding.Can it be done without styling.