You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
With the new update to UI controls I am seeing an issue with text area. I have my own UI library I use and handle setting the font size for form controls.
When setting a font size for inputs and textarea elements the size is being incorrectly calculated. Upon inspecting the computed values show the same cascade but produce different results.
It appears to be some issue with the font family. When setting the font family to monospace which is default the size is affected.
Reproduce:
Visit bootstrap page. Inspect the text area in devtools. https://getbootstrap.com/docs/4.5/components/forms/
Toggle the font-family inherit on an off inside the _reboot.scss file and you will notice the computed size changes.
Issue:
Setting input and text area to ".75rem" value produces different calculated values. Before the update to the new form controls this was not an issue.
Input element font size declaration produces a computed value based off the root size.
.75rem = 12px
Textarea element font size declaration produces a computed value based off the UA agent stying.
.75rem = 9.75px
The text was updated successfully, but these errors were encountered:
With the new update to UI controls I am seeing an issue with text area. I have my own UI library I use and handle setting the font size for form controls.
Thanks for filing the bug @xjdesigns - to clarify are you referring to the change to the Chromium based controls? Haven't had a chance to look at your issue yet but does this issue repro in Firefox/Safari assuming you are referring to the Chromium changes?
@gregwhitworth Sorry for the delay.
Yes correct. When the new update rolled out with the new controls I noticed the issue. This issue is Chromium only. When inspecting with Safari and Firefox the issue is not present. I will verify on new edge with uses Chromium.
I am not able to validate with and older version of Chromium which did not have the issue but I think this would have been caught as well.
I have broke it down to the font family. I did implement a workaround for now by setting it to inherit but it was not needed previously.
I checked new Edge which uses Chromium and the latest has the same issue. From my understanding new Edge would have Open UI. Please correct me if I am wrong.
There hasn't been any discussion on this issue for a while, so we're marking it as stale. If you choose to kick off the discussion again, we'll remove the 'stale' label.
With the new update to UI controls I am seeing an issue with text area. I have my own UI library I use and handle setting the font size for form controls.
When setting a font size for inputs and textarea elements the size is being incorrectly calculated. Upon inspecting the computed values show the same cascade but produce different results.
It appears to be some issue with the font family. When setting the font family to monospace which is default the size is affected.
Reproduce:
Visit bootstrap page. Inspect the text area in devtools.
https://getbootstrap.com/docs/4.5/components/forms/
Toggle the font-family inherit on an off inside the _reboot.scss file and you will notice the computed size changes.
Issue:
Setting input and text area to ".75rem" value produces different calculated values. Before the update to the new form controls this was not an issue.
Input element font size declaration produces a computed value based off the root size.
.75rem = 12px
Textarea element font size declaration produces a computed value based off the UA agent stying.
.75rem = 9.75px
The text was updated successfully, but these errors were encountered: