How to style category boxes?

I’ve expanded the boxes to take the entire width, to simplify the UX.

But what I struggle with is to align headings and descriptions to the left.

Which selector is responsible for the text alignment?

1 Like

So… no one?

Did you try to find out yourself?
Make CSS changes on Your Site explains how you can find selectors by using your browsers inspect tool.

For example using “inspect” at the name of the category already takes you to
image
When you click the triangle, you can see

Looks like

.category-boxes h3 {
    text-align: center;
}

is the css you want to overwrite.
You can find the description right below

3 Likes

Of course I did.

The thing is there’s something blocking it.

text-align: left !important brings no visible results.

When I try
text-align: center; text-indent: -100px; it moves the text as expected.

That’s where I’m stuck.

in common css of a theme or theme component:

.category-boxes .description,
.category-boxes h3 {
    text-align: left;
}

sceenshot of result:

1 Like