# label overlap with larger font sizes

**URL:** https://talk.observablehq.com/t/label-overlap-with-larger-font-sizes/8357
**Category:** Help
**Created:** [October 11, 2023, 5:43pm UTC](https://talk.observablehq.com/t/label-overlap-with-larger-font-sizes/8357 "2023-10-11T17:43:55Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![rmesser](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/rmesser/32/8104_2.png) [@rmesser](https://talk.observablehq.com/u/rmesser)
#### Post date: [October 11, 2023, 5:43pm UTC](https://talk.observablehq.com/t/label-overlap-with-larger-font-sizes/8357/1 "2023-10-11T17:43:55Z")

</div>

I’m using the style setting with fontSize to make labels larger. This tends to cause labels to overlap, as in this example: [Untitled / Robert Messer's Workspace | Observable](https://observablehq.com/d/7d6a3b9200af47b6) .

I’ve found that I can use the margin setting to compensate and prevent the overlap. That’s fine, but is there any way to prevent the labels from overlapping by default, so that I don’t have to manually tweak them depending on the font size setting?

---

<div class="post-metadata">

### Author: ![aaronkyle](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/aaronkyle/32/8106_2.png) [@aaronkyle](https://talk.observablehq.com/u/aaronkyle)
#### Post date: [October 12, 2023, 5:11pm UTC](https://talk.observablehq.com/t/label-overlap-with-larger-font-sizes/8357/2 "2023-10-12T17:11:11Z")

</div>

Hi @rmesser - I don’t know that there’s a method within Plot to do this, but as a hack, you can try something like creating a font size variable, e.g. `fontSize = 1.2`, and then writing your margin to update proportionally to it, e.g. `marginBottomEstimate = fontSize * 50` and then in your plot

```auto
style: {fontSize: fontSize + "em" },
  marginBottom: marginBottomEstimate

```

Here’s a suggestion that does this. It sorta works 🙂

> **[Untitled](https://observablehq.com/d/6d314573eba0e10c)**

---

<div class="post-metadata">

### Author: ![rmesser](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/rmesser/32/8104_2.png) [@rmesser](https://talk.observablehq.com/u/rmesser)
#### Post date: [October 12, 2023, 5:29pm UTC](https://talk.observablehq.com/t/label-overlap-with-larger-font-sizes/8357/3 "2023-10-12T17:29:46Z")

</div>

Thanks @aaronkyle for that suggestion. I tried it out and agreed that this mostly works.

In general I think preventing label collisions is a tricky problem to solve generally, so individual chart tweaks to margins will probably always be needed from time to time. Regards.