Sub categories as Buttons instead of images

Try this

.woocommerce .widget_product_categories ul:not(.children)>li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
line-height: 1.7em;
border-bottom: 3px solid #ddd;
margin-top: 0.35em;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}

.woocommerce .widget_product_categories span.count {
color: #ddd;
margin-left: auto;
font-size: 0.8em;

Thanks! should i add it in the custom CSS section?

Hi there,
Looking at the CSS snippet you were offered, I see that there is a missing closing brace after the last line.
So

.woocommerce .widget_product_categories span.count {
color: #ddd;
margin-left: auto;
font-size: 0.8em;

should look like

.woocommerce .widget_product_categories span.count {
color: #ddd;
margin-left: auto;
font-size: 0.8em;
}

I can’t verify that the above CSS snippet will work but, yes you can add it to the Additional CSS of the customiser and it will be applied.

I hope that helps you to figure it out.
Feel free to get back to us if you have further questions.

We haven’t heard back from you in a while, so I’m going to mark this as resolved – if you have any further questions, you can start a new thread.