# Long category names overlap with replies on suggested topics list

**URL:** <https://meta.discourse.org/t/long-category-names-overlap-with-replies-on-suggested-topics-list/33231>\
**Category:** Bug\
**Tags:** suggested-topics\
**Created:** [2015 年 9 月 14 日午後 4:35 UTC](https://meta.discourse.org/t/long-category-names-overlap-with-replies-on-suggested-topics-list/33231 "2015-09-14T16:35:30Z")\
**Posts on this page:** 1\
**Showing post:** 2

<div class="post-metadata">

**Author:** ![simon](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/simon/32/339122_2.png) [@simon](https://meta.discourse.org/u/simon)\
**Post date:** [2015 年 9 月 14 日午後 7:12 UTC](https://meta.discourse.org/t/long-category-names-overlap-with-replies-on-suggested-topics-list/33231/2 "2015-09-14T19:12:47Z")

</div>

I’ve been working on something like this. There is a lot of empty space to the left of your category names. One solution is to give the topic-list columns fixed widths as a percentage of the total width. You could try something like this in the custom css area:

```css
#suggested-topics .topic-list {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  *, *:after, *:before {
    -moz-box-sizing: inherit;
    box-sizing: inherit;
  }
}

#suggested-topics .topic-list .main-link,
#suggested-topics th.default { // th.default is the topic header - should maybe have .main-link added as a class.
  width: 40%;
}

#suggested-topics .topic-list .category {
  width: 30%;
}

#suggested-topics .topic-list .posts {
  width: 10%;
}

#suggested-topics .topic-list .views {
  width: 10%;
}

#suggested-topics .topic-list .activity {
  width: 10%;
}

```

Adjust the percentage values (make sure they total 100%) to find something that works. As they are set up at the moment, the category names will not wrap - if they exceed the width of their container they will extend past it. That could be changed.

 ![](https://global.discourse-cdn.com/meta/original/3X/9/d/9d557b9bf62e3cfe209808eff915f2ab434dd04f.png)

Edit - I see that the problem is with the suggested-topics list. I’ve updated the css. It is targeting both the list-container topic-list and the suggested-topics topic list. You probably want to treat them separately though.

 ![](https://global.discourse-cdn.com/meta/original/3X/7/8/783c951c2ecd3647d3773891de7abe9532b2703a.png)

Edit - I’ve updated the css to just target the suggested topics list - and to make it actually work 🙂

---

_[View the full topic](https://meta.discourse.org/t/long-category-names-overlap-with-replies-on-suggested-topics-list/33231)._