Title text alignment in on category cards with category groups plugin

Support
1

This plugin is great, but there seem to be some nuances. Enabling the plugin gives us this out of the box:

The image features the logos of "1Secure" and "Auditor," with a dropdown menu labeled "Products." (Captioned by AI)
The image features the logos of "1Secure" and "Auditor," with a dropdown menu labeled "Products." (Captioned by AI)983×294 7.92 KB

Simple enough, we add this css:

.category-box-heading {
    align-self: center;
}

and it’s all good:

The image shows a drop-down menu with two options, "1Secure" and "Auditor," each accompanied by a distinct logo. (Captioned by AI)
The image shows a drop-down menu with two options, "1Secure" and "Auditor," each accompanied by a distinct logo. (Captioned by AI)994×300 8.12 KB

EXCEPT, when the title has two lines. For some reason, nothing I do seems to move it to center:

The image displays a logo composed of four blue squares connected by lines, forming a spherical shape with a red square, and the text "GroupID Password Management" on a dark background. (Captioned by AI)
The image displays a logo composed of four blue squares connected by lines, forming a spherical shape with a red square, and the text "GroupID Password Management" on a dark background. (Captioned by AI)481×274 6.87 KB

I can’t seem to see what would prevent two-line category titles from moving center and even using the browser dev tools, I couldn’t figure out how to force it to center.

1 Like
2

Try this instead:

.category-details .parent-box-link h3 {
    text-align: center;
}

:slight_smile: