Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.Problem/Motivation
Discovered on https://www.drupal.org/about/core/policies/maintainers/commit-guide#comm....
The auto-generated permalinks for <h4> headers (and possibly <h3> etc. as well) overlap the list item bullets when used inside a list.
Steps to reproduce
- Add the following markup to a guide page:
<ol> <li> <h4>Example header</h4> </li> </ol> - Observe that the
#permalink overlaps the list bullet.
Proposed resolution
Needs some negative margin or padding fix.
Remaining tasks
User interface changes
Ideally the fragments are properly nested within the list items.
API changes
Small CSS change.
Data model changes
N/A
| Comment | File | Size | Author |
|---|---|---|---|
| ol_h4_issue.png | 44.25 KB | xjm |
Comments
Comment #2
xjmComment #3
drummThe negative margins only kick in at large screen sizes, when there is a left margin to hang the octothorp in. At smaller screen sizes, they are shown inline. We can do the same, at all screen sizes, for any headings that are not top-level within their field. This should be more straightforward & resilient, negative margins are prone to edge cases like this.
Comment #5
drummThis has been deployed.