# Discourse Button Styles

**URL:** <https://meta.discourse.org/t/discourse-button-styles/88154>\
**Category:** Theme component\
**Created:** [May 22, 2018, 3:38pm UTC](https://meta.discourse.org/t/discourse-button-styles/88154 "2018-05-22T15:38:29Z")\
**Posts on this page:** 1\
**Showing post:** 14

<div class="post-metadata">

**Author:** ![bts](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/bts/32/184556_2.png) [@bts](https://meta.discourse.org/u/bts)\
**Post date:** [June 21, 2018, 9:59pm UTC](https://meta.discourse.org/t/discourse-button-styles/88154/14 "2018-06-21T21:59:34Z")

</div>

Hey @awesomerobot looks cool! Related to this I have some quick feedback based on my experience adding custom button styles to our theme at [https://forum.troygrady.com/](https://forum.troygrady.com/)

We added rounded corners on all our buttons. And along with this, we changed some spacing / grouping of the buttons. For example our main homepage buttons look like this:

![55%20PM](https://global.discourse-cdn.com/meta/original/3X/b/4/b476565bbadc392d3865cd837157062ea4d5e212.png)

(NB: we think categories makes sense separate since it’s more a different view vs. a way of filtering the topics list.)

This looks good for the most part. Except when there are no “new” or “unread”, it looks like this:

![00%20PM](https://global.discourse-cdn.com/meta/original/3X/6/e/6e5616cc897cd021b442f9a077f9bb5528ee7bb6.png)

We got the first button in the group here using:

```plaintext
.nav-pills>li:first-child

```

But tricky getting the last one in that group since the # of buttons changes. If there were a way to have the `/new` and `/unread` buttons removed from the DOM rather than hidden in such cases, then I could target these more consistently e.g. target `/top` using:

```plaintext
.nav-pills>li:nth-last-child(2)

```

Pretty minor but figured this was as good a spot as any to chime in w/ some CSS button detail!

---

_[View the full topic](https://meta.discourse.org/t/discourse-button-styles/88154)._