# Meta Post - Common CSS Hacks

**URL:** <https://forum.obsidian.md/t/meta-post-common-css-hacks/1978>\
**Category:** Themes & CSS snippets\
**Tags:** custom-css\
**Created:** [June 16, 2020, 2:17pm UTC](https://forum.obsidian.md/t/meta-post-common-css-hacks/1978 "2020-06-16T14:17:57Z")\
**Posts on this page:** 1\
**Showing post:** 64

<div class="post-metadata">

**Author:** ![rsdimitrov](https://forum.obsidian.md/user_avatar/forum.obsidian.md/rsdimitrov/32/746_2.png) [@rsdimitrov](https://forum.obsidian.md/u/rsdimitrov)\
**Post date:** [July 24, 2020, 10:41am UTC](https://forum.obsidian.md/t/meta-post-common-css-hacks/1978/64 "2020-07-24T10:41:40Z")

</div>

## Tag Pills in editor (tested on 0.8.0)

Before  
 ![image](https://forum.obsidian.md/uploads/default/original/2X/b/b8770d180a2da6ce008ff668fbfa809843331d3b.png)

After  
 ![image](https://forum.obsidian.md/uploads/default/original/2X/6/60eeb7390c84bc02d0f47a981a2f803728eed9cd.png)

To get tag pills in editor, get the code from this post:

> [@Meta Post - Common CSS Hacks](https://forum.obsidian.md/t/meta-post-common-css-hacks/1978/13):
>
> this worked for me : .tag[href="#important"] { color : red; } Tag Pills 0.73 [Obsidian\_7eMo0E8BFS] .tag { background-color: var(--text-accent); border: none; color: white; font-size: 11px; padding: 1px 8px; text-align: center; text-decoration: none; display: inline-block; margin: 0px 0px; cursor: pointer; border-radius: 14px; } .tag:hover { color: white; background-color: var(--text-accent-hover); } .tag[href^="#obsidian"] { background-color: #4d3ca6; } .tag[href^=…

Then replace this block (the first one):

```
.tag {
  background-color: var(--text-accent);
  border: none;
  color: white;
  font-size: 11px;
  padding: 1px 8px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  margin: 0px 0px;
  cursor: pointer;
  border-radius: 14px;
}

```

with these two:

```
div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-hashtag-end:before {
    content: '#';
}
.tag, div:not(.CodeMirror-activeline) > .CodeMirror-line span.cm-hashtag-end {
  background-color: var(--text-accent);
  border: none;
  color: white !important;
  font-size: 11px;
  padding: 1px 8px;
  text-align: center;
  text-decoration: none !important;
  display: inline-block;
  margin: 0px 0px;
  cursor: pointer;
  border-radius: 14px;
}

```

---

_[View the full topic](https://forum.obsidian.md/t/meta-post-common-css-hacks/1978)._