Threaded comment CSS help

I changed the bg color to show the problem I’m talking about. Ideally, each li item would clear the color to the left.

Also, I noticed that other blogs use dd and dt tags instead of ul li. Is there an easy way to switch to that syntax?

That indent happens because the comments are nested lists so there is not an easy way to change — but you may be able to neutralize the nested left margin increasing by adding a negative left-margin to the inside li elements — see what happens when you add it to your existing style:

.commentlist li .comment.depth-3 {
    background-color: #7FB139;
    margin-left: -40px;
}

That neutralized it, but I still prefer to have the indent. I just want each comment to maintain its own background color and have it span the entire width of the comment section. Is that not going to be possible?

I’m not sure I understand what you are trying to do. You’re saying you want the indent but you don’t want it?? Can you explain another way?

Oh wait, maybe I got it — try this:

.commentlist li .comment.depth-3 {
    background-color: #7FB139;
    margin-left: -40px;
    padding-left: 40px;
}

Sorry. I want the indent. But I don’t like how the bgcolor of the prior comment carries into the child comment. I want each child comment to be free of formatting from its parent thread.

Does that make sense?

That’s a really nice alternative. I’d still prefer white space to fill that padding space. Is that possible? If not, this might be my best option.

Did you try my second post above — does that do it?

Sorry, I still don’t get what you want, so not sure if it’s possible. Can you draw it and post an image?

This is what I’m talking about.

https://i46.tinypic.com/1621vrq.png

Ah, okay gotcha, hits self on head! You can add space between the comments by adding a margin to this:

.commentlist li {
    margin-top: 20px;

But then, yes, the background of the containing element DOES show. Because those are nested elements, there’s probably not a way to get rid of that except by setting a height on the element. But that would limit the length of the comments — not ideal either.

So it may be that the only way to fix this would be to totally redesign the way the comments are coded in the HTML.