SelectControl: Remove the line height setting to fix issue with font descenders being cut off#40985
Conversation
|
This is looking good in viewports > 600px. There's a slight regression (about 1px) in narrower screen widths. Before
After
But it's not a huge difference and I think the improvement at desktop widths appears worth it. As far as I can tell a value of
|
ramonjd
left a comment
There was a problem hiding this comment.
Left a note about narrow screens.
Happy to look again if there's a fix in this PR or a follow up.
|
@ramonjd it seems like the following padding css from WP core is the cause of the issue: .wp-core-ui select {
padding: 5px 24px 5px 8px;
}I have pushed an update which resets the top and bottom padding and this seems to fix the issue in wide and narrow screens now. |
|
More screenshots === LGTM! 💻
📱
|
|
Thank you for working on this ❤️ Just a small nit — when working in the |
Sure, thanks for the reminder, and thanks for adding the details for this one for me 🙏 |
What?
Removes the fixed lineheight 1 the SelectControl component
Why?
In places like the Gallery block Image size selector this lineheight setting causes font descenders to be cut off
Fixes: #27194
How?
Just removes the lineheight setting and allows it to be inherited
Testing Instructions
Largeoptiongin theLargeis not cut offScreenshots or screencast
Before:
After:
