Support » Themes and Templates » How to Style all levels of threaded comments with same font size

  • Resolved readwriteandedit


    Looking for help styling threaded comments. I want all levels to use the same size font. Right now, successive levels have fonts each larger than the last. I’m not sure how to adjust my style sheet.

    I tried

    .commentlist li ul li {
    font-size: 1em;

    as someone suggested on another thread here, but that changed nothing. I’m guessing I need to account for children or parent or the 5 levels of comments in some way. I tried quite a few combinations of the above style code, adding .children, but I get no change in the size of my font.

    Site is wombatwisdom. A post with the levels of threaded comments is Blog is Open.

    Thanks for the help.

Viewing 12 replies - 1 through 12 (of 12 total)
  • Joseph


    Use this:

    div#single-body ol li li {
        font-size: 1em;



    I would use

    #selector ol li ol li {
             font-size: 1em



    Threaded comments are unordered lists inside ordered list so that won’t work.



    @readwriteandedith. i dont have an answer but will like to ask you a question please, can you please tell me which plugin did you use to style your post? i have been looking to make my post look like that for long. i mean plugin thats gives your each post a header and read more button.




    maybe just use

    .commentlist li{

    this selects all the li elements, regardless of whether it’s in a ul or ol.

    You also seem to have many conflicting selectors in your stylesheet like .comment-body p, div#single-body ol li and div#single-body ul li etc that all specify font sizes. This is a bad idea. Just define the font size for everything at once and then specify sizes for sub-elements after like .comment-meta etc.



    well in that case do

    ol li ul li

    simple descendant selectors



    Thanks for the tips. I’ll try each.

    Moshoodo 123, there is no plugin for styling. This is the PressPlay theme and the styling is all in the style.css that came with it.



    Miocene22, I’m not sure about the selectors or why they’re styled as they are. This was the stylesheet that came with the theme; I’ve only tweaked it a bit. I’ll try first what you suggested, though I think that was one I tried.

    I only know a little about CSS so this is all guesswork to me.

    Joseph, that div#single-body code worked. Thank you. I’m not sure if it will affect other lists anywhere else, but it took care of this.

    I’m not sure why .comment-list li didn’t style the threaded comments. I thought that was exactly what it was for.

    Thanks for all the help.

    dont all the nested comments have a ul class of children ?

    ul.children {} etc

    Root, they do indeed have children. I tried a couple of options using children, but maybe I didn’t get it exactly right. I may try that route again, since it should work. (And I so dislike not being able to make something work that should work.)

    Thanks for following up. I appreciate the help and input.

    Root, just in case you’re still following this:

    The styling for threaded comments should be
    ol.commentlist li.comment ul.children li.comment {}
    or a variation thereof.

    I say should be because I couldn’t get any variation of this to change the font size in my threaded comments.

    The simplest ul.children did nothing. ul.children li did nothing. And so on. I even tried styling a specific level of comment with ol.commentlist li.comment ul.children li.depth-2, since I had comments of that level, but I saw no change in the font size.

    If anyone else has an answer as to why the commentlist styling didn’t work, I’m sure that would help us all out. At this point, I’m going with Joseph’s suggestion using div#single-body since that did work.

    Once again, thanks to all.

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘How to Style all levels of threaded comments with same font size’ is closed to new replies.