Skip to content

Commit

Permalink
Add <br clear="both"> to fix anchor scroll position on Firefox
Browse files Browse the repository at this point in the history
On desktop versions of Mozilla Firefox browser, clicking on
"Social Fabric" (English) or "Tissu social" (French):

- https://opendrr.github.io/national-human-settlement/en/index.html#nhsl_social_fabric_indicators-a
- https://opendrr.github.io/national-human-settlement/fr/#nhsl_social_fabric_indicators-a

would jumped to the wrong position, near the Data Resources heading of
the previous Physical Exposure section.  Apparently, Firefox’s Gecko
handles the layout after uncleared floating images differently than
Chrome’s Blink engine.

See also https://stackoverflow.com/questions/4673671/floating-elements-br-clear-both-in-a-better-css-way
  • Loading branch information
anthonyfok committed Feb 7, 2025
1 parent 60208e5 commit 20e66d5
Show file tree
Hide file tree
Showing 2 changed files with 4 additions and 0 deletions.
2 changes: 2 additions & 0 deletions docs/_pages/en/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -103,6 +103,8 @@ breadcrumbs:
{% include nhsl-resources.html lang = page.lang layer = layer %}
</div>

<br clear="both">

{% endfor %}

{% assign var_length = variables.size | minus: 3 %}
Expand Down
2 changes: 2 additions & 0 deletions docs/_pages/fr/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -103,6 +103,8 @@ breadcrumbs:
{% include nhsl-resources.html lang = page.lang layer = layer %}
</div>

<br clear="both">

{% endfor %}

{% assign var_length = variables.size | minus: 3 %}
Expand Down

0 comments on commit 20e66d5

Please sign in to comment.