1430346 - Add top -margin and positive padding to headers with IDs when toc is sticky

Status: RESOLVED DUPLICATE of bug 1424403

(developer.mozilla.org Graveyard :: Wiki pages, enhancement)

Description

[thinkin.arbys]

What problem would this feature solve?
======================================
When I link to a page with a hash (e.g. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Swapping_variables) if the browser window is large enough, the sticky TOC covers up the heading.

A simple fix to this would be adding this to the CSS:

    @media (min-height: 42.5em) and (min-width: 47.9385em) {
        #wikiArcticle {
            margin-top: -50px;
            padding-top: 50px;
        }
    }

It looks like the TOC, at least in Chrome, is 47px tall, so using 50px gives a 3px buffer.

Also, I noticed while peaking at the DOM that the TOC list items use `.toc-links li { word-wrap: nowrap; }`.  I believe `word-wrap` is supposed to be `white-space`.

Who has this problem?
=====================
All visitors to MDN

How do you know that the users identified above have this problem?
==================================================================
It's static content.

How are the users identified above solving this problem now?
============================================================
They aren't... it's minor

Do you have any suggestions for solving the problem? Please explain in detail.
==============================================================================
Add this to the CSS file.

    @media (min-height: 42.5em) and (min-width: 47.9385em) {
        #wikiArcticle {
            margin-top: -50px;
            padding-top: 50px;
        }
    }

Is there anything else we should know?
======================================

Comment 1

[John Whitlock [:jwhitlock]]

This is the same issue as bug 1424403, and we DUPLICATE to the earlier bug. thinkin.arbys, I'd appreciate if you added your CSS suggestions to that bug.