Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix roadheight field width #10175

Merged
merged 2 commits into from
Mar 27, 2024
Merged

Fix roadheight field width #10175

merged 2 commits into from
Mar 27, 2024

Conversation

1ec5
Copy link
Collaborator

@1ec5 1ec5 commented Mar 22, 2024

Recent versions of Firefox give input fields a greater intrinsic width that causes roadheight fields to overflow the container. Constrain these input fields to an initial width of zero; they’ll grow proportionally as part of the flexbox.

The four text fields that make up the Road Height field no longer overflow horizontally.

Fixes #10174.

@1ec5 1ec5 added bug A bug - let's fix this! bug-browser-specific A bug that only appears in certain browsers field An issue with a field in the user interface labels Mar 22, 2024
@1ec5 1ec5 self-assigned this Mar 22, 2024
erictheise added a commit to OpenHistoricalMap/iD that referenced this pull request Mar 22, 2024
… by cherry picking Minh's upstream pull request, openstreetmap#10175, and regenerating dist assets.
erictheise added a commit to OpenHistoricalMap/ohm-website that referenced this pull request Mar 22, 2024
… by cherry picking Minh's upstream pull request, openstreetmap/iD#10175, and regenerating dist assets.
Recent versions of Firefox give input fields a greater intrinsic width that causes roadheight fields to overflow the container. Constrain these input fields to an initial width of zero; they’ll grow proportionally as part of the flexbox.
@1ec5 1ec5 force-pushed the 1ec5-roadheight-flex-10174 branch from 8bdfcaf to f64e800 Compare March 23, 2024 00:07
@1ec5
Copy link
Collaborator Author

1ec5 commented Mar 23, 2024

I tested this fix in Chrome 123, Firefox 125.0b3, and Safari 17.3.1 on macOS.

Copy link
Member

@tyrasd tyrasd left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I noticed that setting width: inherit also fixes the problem, but I guess keeping the width in sync with the flex-basis is slightly better as it is a more explicit fix/workaround…

@tyrasd tyrasd merged commit a38d7a1 into develop Mar 27, 2024
4 checks passed
@tyrasd tyrasd deleted the 1ec5-roadheight-flex-10174 branch March 27, 2024 13:30
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug A bug - let's fix this! bug-browser-specific A bug that only appears in certain browsers field An issue with a field in the user interface
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Height Limit field horizontally overflows sidebar
2 participants