# Code over lapping display

**URL:** <https://talk.observablehq.com/t/code-over-lapping-display/10890>\
**Category:** Feedback\
**Created:** [September 28, 2026, 12:47pm UTC](https://talk.observablehq.com/t/code-over-lapping-display/10890 "2026-09-28T12:47:07Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![shadoof](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/shadoof/32/4231_2.png) [@shadoof](https://talk.observablehq.com/u/shadoof)\
**Post date:** [September 28, 2026, 12:47pm UTC](https://talk.observablehq.com/t/code-over-lapping-display/10890/1 "2026-09-28T12:47:07Z")

</div>

I’m seeing code overlapping display on some (all?) pinned cells in new Observable.

 ![Screenshot 2026-09-28 at 8.40.58 am](https://canada1.discourse-cdn.com/flex030/uploads/observablehq/original/2X/1/14d9dfb8357aa4e06812a94515b6af9b997158f8.png)

 ![Screenshot 2026-09-28 at 8.43.19 am](https://canada1.discourse-cdn.com/flex030/uploads/observablehq/original/2X/3/3fab0fae7676db6276d0b4b6bd624023c85607d9.png)

---

<div class="post-metadata">

**Author:** ![tophtucker](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/tophtucker/32/4781_2.png) [@tophtucker](https://talk.observablehq.com/u/tophtucker)\
**Post date:** [September 28, 2026, 1:07pm UTC](https://talk.observablehq.com/t/code-over-lapping-display/10890/2 "2026-09-28T13:07:06Z")

</div>

@shadoof Can you post a link to an example?

---

<div class="post-metadata">

**Author:** ![mcmcclur](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/mcmcclur/32/2364_2.png) [@mcmcclur](https://talk.observablehq.com/u/mcmcclur)\
**Post date:** [September 28, 2026, 1:24pm UTC](https://talk.observablehq.com/t/code-over-lapping-display/10890/3 "2026-09-28T13:24:51Z")

</div>

> [@shadoof](#):
>
> I’m seeing code overlapping display on some (all?) pinned cells in new Observable.

The logical guess is that there’s some CSS that the notebook defines or has been imported in somehow. Hard to say for sure, though, without a notebook.

---

<div class="post-metadata">

**Author:** ![shadoof](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/shadoof/32/4231_2.png) [@shadoof](https://talk.observablehq.com/u/shadoof)\
**Post date:** [September 28, 2026, 1:29pm UTC](https://talk.observablehq.com/t/code-over-lapping-display/10890/4 "2026-09-28T13:29:21Z")

</div>

[https://observablehq.com/@shadoof/typhoon-analysis#utilities](https://observablehq.com/@shadoof/typhoon-analysis#utilities)

There is a little extra CSS in this notebook but I don’t think it should interfere. Thanks for taking a look.

---

<div class="post-metadata">

**Author:** ![mbostock](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/mbostock/32/9_2.png) [@mbostock](https://talk.observablehq.com/u/mbostock)\
**Post date:** [September 28, 2026, 3:25pm UTC](https://talk.observablehq.com/t/code-over-lapping-display/10890/5 "2026-09-28T15:25:29Z")

</div>

I don’t see any layout glitches in the linked notebook. But, I do know that it’s possible to misalign the cells if you add custom CSS, and specifically if you add margins to cells, or margins to contents within cells that extend beyond the border of cells. In rare cases it may also be possible to add CSS that temporarily disturbs the alignment which may be fixed by reloading.

I don’t believe there’s anything we can do to handle custom margins more gracefully, so… try to be careful when adding custom CSS. Good luck!

---

<div class="post-metadata">

**Author:** ![tophtucker](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/tophtucker/32/4781_2.png) [@tophtucker](https://talk.observablehq.com/u/tophtucker)\
**Post date:** [September 28, 2026, 4:27pm UTC](https://talk.observablehq.com/t/code-over-lapping-display/10890/6 "2026-09-28T16:27:58Z")

</div>

Yeah the part you screenshotted above looks fine to me (in macOS Chrome, Safari, and Firefox):

 ![image](https://canada1.discourse-cdn.com/flex030/uploads/observablehq/original/2X/6/686bbedf7b7d950b2ea9dfd1975dba8a78361fce.png)

What browser are you in? Does it only appear misaligned when you make some edit or change some input? Hm
