[Resolved] Styling Comment

[Willya]

Hi,

I would like to customize my comment like this: https://prnt.sc/Lov05KqikHnJ

I tried myself to CSS-it, but can not find a way to..
1. create a border-bottom for each comment (see screenshoot)
2. create a border-left for third comment (see screenshoot)

I have input my website url in private information.

Thanks!

[Fernando]

Hi Willya,

Try adding this in Appearance > Customize > Additional CSS:

ol.comment-list > li.comment {
    border-bottom: solid 1px #000;
    padding-bottom: 20px;
}

ol.comment-list > li.comment > ul.children > li.comment > ul.children > li.comment {
    border-left: solid 1px #000;
    padding-left: 20px;
}

ol.comment-list > li.comment > ul.children > li.comment > ul.children > li.comment:not(:last-of-type) {
    margin-bottom: 20px
}

You may change the values to your preference.

[Willya]

Thank you Fernando. I change some of the values, but its easy as you have provided me with the classes of CSS.

[Fernando]

You’re welcome Willya!

[Author]

Posts