Skip to content

Conversation

@stroebjo
Copy link
Contributor

@stroebjo stroebjo commented Nov 2, 2025

Depending on a parent container styling (overflow-wrap: break-word;) the unit in the scale control could be wrapped in two lines (km -> k\nm).

Adding white-space: nowrap; to the scale styling ensures it's indepdendent from any parent container styling.

Current With PR
Screenshot of Map with line-break in scale Screenshot of Map with NO line-break in scale

Launch Checklist

  • Confirm your changes do not include backports from Mapbox projects (unless with compliant license) - if you are not sure about this, please ask!
  • Briefly describe the changes in this PR.
  • Link to related issues.
  • Include before/after visuals or gifs if this PR includes visual changes.
  • Write tests for all new functionality.
  • Document any changes to public APIs.
  • Post benchmark scores.
  • Add an entry to CHANGELOG.md under the ## main section.

…6646)

Depending on a parent container styling (overflow-wrap: break-word;) the unit in the scale control could be wrapped in two lines (km -> k\nm).

Adding white-space: nowrap; to the scale styling ensures it's indepdendent from any parent container styling.
@codecov
Copy link

codecov bot commented Nov 2, 2025

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 96.14%. Comparing base (d050d9c) to head (f120edb).
⚠️ Report is 2 commits behind head on main.

Additional details and impacted files
@@            Coverage Diff             @@
##             main    #6647      +/-   ##
==========================================
- Coverage   96.29%   96.14%   -0.15%     
==========================================
  Files         293      293              
  Lines       35481    35481              
  Branches     8691     8690       -1     
==========================================
- Hits        34166    34114      -52     
- Misses       1315     1367      +52     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@HarelM
Copy link
Collaborator

HarelM commented Nov 2, 2025

Thanks for taking the time to report and fix this issue.
Can you please add a "before" and "after" visuals?

@stroebjo
Copy link
Contributor Author

stroebjo commented Nov 2, 2025

I updated the first comment with screenshots.

@HarelM
Copy link
Collaborator

HarelM commented Nov 2, 2025

Thanks!

@HarelM HarelM merged commit 5dd1674 into maplibre:main Nov 2, 2025
26 checks passed
melitele pushed a commit to melitele/maplibre-gl-js that referenced this pull request Jan 8, 2026
…6646) (maplibre#6647)

* Fix ScaleControl wrapping in case of parent break-word CSS (maplibre#6646)

Depending on a parent container styling (overflow-wrap: break-word;) the unit in the scale control could be wrapped in two lines (km -> k\nm).

Adding white-space: nowrap; to the scale styling ensures it's indepdendent from any parent container styling.

* docs: changelog entry
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

ScaleControl unit label (like "km") can have line break depending on parent overflow-wrap style and zoom level

2 participants