How can I narrow down clickable area of sections?

[TetraTheta]

Maybe this would fit as an issue, rather than a discussion, but I also think this would be personal taste, so here it is.

---

At the top of blog front page, there is a area for taxonomies like this:

But I often find myself clicking and moving to these taxonomies because clickable area is too wide for its content.

I want to narrow down these clickable area to be like red box at the image above. How can I do it?

These area doesn't cause problem with mobile environment, but cause problem in PC environment (and maybe tablet environment too). I don't think PC user will have problem navigating to these section if clickable area is narrowed down...

[razonyang]

You can either 1) wrap the tag inside other tag or 2) remove the nav-fill.

I haven't tested, not sure if it can help.

[TetraTheta]

.nav {
  justify-content: space-evenly;
}
.nav-fill > .nav-link {
  flex: initial;
}

Using this was enough for me. It is not perfect, but I'm OK with it.