Warnings

These sections appear in the Element tab only when they have something to say about the selected element. An element with nothing to warn about, no shadow and no gradient shows none of them.

A Warnings section appears under the box model when something about the selected element is worth knowing.

Something is on top of this#

A click at the element's visible centre would reach another element. The row names it, with its z-index and the stacking context it counts in, and the selected element's own beside it, since a cover usually wins by stacking. Compare in Stacking opens the Stacking section.

1. Select the element that does not respond to clicks.
2. In Warnings, hover the row to outline the covering element on the page, and press it to select it.

Ignores clicks means the element has pointer-events: none, and Partly covered means the centre is free but a click elsewhere on it is not: four points inside it and eight along its edge (each corner and the middle of each side, 2px in) are tried too, so a strip over just the edge is found. The row says how many edge points miss and names what covers them.

An element inside a same-site frame is checked where it shows: inside the window and inside its frame, so something on the top page lying over the frame is found too.

Drawn in a fallback font#

Select text. When the first named font in the element's font-family did not load, the text is set in the next one, and a warning names both. A web font that is still downloading reads as missing until it arrives; select the element again to check.

Under it is the whole stack: each family with what became of it, struck out when it did not load, then the one drawn, then the ones after it that were not needed.

Faked bold or italic#

When bold is asked of a web font that has no bold face, the browser thickens the regular one, and the warning says Faked bold with the face it drew. Italic is the same, slanted from the upright face. Load the missing face, or set font-synthesis: none to stop the browser faking it.