Table of contents conflicts with `NOTE` box

[LeviHarrison]

This issue appears in:

• https://prometheus.io/docs/guides/go-application/
• https://prometheus.io/docs/guides/node-exporter/
• https://prometheus.io/docs/guides/basic-auth/
• https://prometheus.io/docs/guides/basic-auth/

(tested in Chrome and Firefox)

[RichiH]

Thanks for the report, reproduced locally in Chromium.

@grobie @juliusv this seems to be new?

[juliusv]

It's because the NOTE block is a div which is a display: block element, which is 100% width by default and also doesn't seem to care about overlapping the float element.

Adding display: inline-block; width: 100%; to the note block seems to help with this particular situation:

I also tried to add a clear: ... with different values to the TOC div, but that also then moves the paragraph text out of the way in a way we don't want.