Inspect Element

The box model, right on the page, where it belongs. Hold Cmd. Move the mouse. Whatever you touch shows you its content, padding, border and margin, with the real numbers. Move on and it keeps up. Let go and it steps aside. Your page stays exactly as it was. Open DevTools and the page loses focus. The autocomplete list collapses. The tooltip disappears. Whatever you opened it to measure is gone before you can measure it. This never leaves the page. Focus stays where you put it, the list stays open, and you measure it. Windows and Linux: hold Ctrl. And it is yours to set up: • Your shortcut, not ours. Any modifiers, with or without a key. • Step outward. Let go, hold again, and you're on the parent. Again, its parent. The wrapper you could never hover is one keystroke away. • Log element. Everything you inspect lands in the console and stays there. Inspect Element is a subscription, and every option is part of it. Sign in with Google and it's free for 7 days.