# Modify text placement of Category Description copy

**URL:** https://meta.discourse.org/t/modify-text-placement-of-category-description-copy/104300
**Category:** Support
**Created:** [12월 14, 2018, 7:32오후 UTC](https://meta.discourse.org/t/modify-text-placement-of-category-description-copy/104300 "2018-12-14T19:32:13Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![jord8on](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jord8on/32/166809_2.png) [@jord8on](https://meta.discourse.org/u/jord8on)
#### Post date: [12월 14, 2018, 7:32오후 UTC](https://meta.discourse.org/t/modify-text-placement-of-category-description-copy/104300/1 "2018-12-14T19:32:13Z")

</div>

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:

 ![Monosnap%202018-12-14%2000-26-30](https://global.discourse-cdn.com/meta/original/3X/0/2/02992d61cfd047c7edcd19b5c09037d3e715deed.jpeg)

This is what I want it to look like:

 ![Monosnap%202018-12-14%2000-26-30-2](https://global.discourse-cdn.com/meta/original/3X/2/1/21c2f28ab05cd64af1b1b1a4e25efeabc3b95129.jpeg)

---

<div class="post-metadata">

### Author: ![Stephen](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/stephen/32/95011_2.png) [@Stephen](https://meta.discourse.org/u/Stephen)
#### Post date: [12월 14, 2018, 8:15오후 UTC](https://meta.discourse.org/t/modify-text-placement-of-category-description-copy/104300/2 "2018-12-14T20:15:58Z")

</div>

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:

 ![52%20PM](https://global.discourse-cdn.com/meta/original/3X/a/d/adb2bc8e8296e0f36141332748b1a5c58ae1699e.png)

 ![31%20PM](https://global.discourse-cdn.com/meta/original/3X/4/8/48354aa555cfa29244de499032c320d88c074cac.png)

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

---

<div class="post-metadata">

### Author: ![jord8on](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jord8on/32/166809_2.png) [@jord8on](https://meta.discourse.org/u/jord8on)
#### Post date: [12월 14, 2018, 8:25오후 UTC](https://meta.discourse.org/t/modify-text-placement-of-category-description-copy/104300/3 "2018-12-14T20:25:31Z")

</div>

Yikes! These GIFs were an icon set [I purchased](http://animaticons.co/) 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

 ![PNG](https://global.discourse-cdn.com/meta/original/3X/2/4/24e7a2773f50d2edf028c9b65b582b2b5503a434.jpeg)

# Mobile AFTER

 ![PNG](https://global.discourse-cdn.com/meta/original/3X/5/d/5daa904bdc4b45956c01b80dbc3db054794888d6.jpeg)

# Desktop BEFORE

 ![Monosnap%202018-12-14%2013-15-07](https://global.discourse-cdn.com/meta/original/3X/9/5/9523ab09d667eaa11991c05f18444370de8a2189.jpeg)

# Desktop AFTER

 ![Monosnap%202018-12-14%2013-16-52](https://global.discourse-cdn.com/meta/original/3X/7/3/7386a0af21f294745b45c126310acc37019e43ae.jpeg)

---

<div class="post-metadata">

### Author: ![system](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/system/32/443519_2.png) [@system](https://meta.discourse.org/u/system)
#### Post date: [1월 13, 2019, 8:31오후 UTC](https://meta.discourse.org/t/modify-text-placement-of-category-description-copy/104300/4 "2019-01-13T20:31:35Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.