Modify text placement of Category Description copy

[jord8on (Jordan)]

I’d like to have the “About” post, for each of my categories, align with the Category icon, as illustrated below…

This is what it looks like now:

This is what I want it to look like:

[Stephen]

The page already aligns the image and text, but your GIFS are surrounded by whitespace. The text is currently aligned to the top of the image, but the top of the image is empty:

Have you tried removing some of that whitespace from the top?

[jord8on (Jordan)]

Yikes! These GIFs were an icon set I purchased and they came with all that extra space. That’s a good point… I can prob trim it down using some online GIF editor.

That said, I’ve been tinkering since I posted the question and came up with the following, which works perfectly!

Here’s the DESKTOP CSS:

.category-logo.aspect-image {
    margin-top: -50px;
}

Here’s the MOBILE CSS:

.category-logo.aspect-image {
    margin: -30px auto -20px auto;
}

And here’s some before and afters which show how things looked before adding the above CSS:

Mobile BEFORE

Mobile AFTER

Desktop BEFORE

Desktop AFTER