Disable automatic change of large umlauts in input fields (in Edge and Chrome)

Question

In my Angular application, capitalized umlauts are automatically changed to the related vowels by Edge and Chrome. Example: In the following image, I typed "ÄÜÖäüö": Edge texte input example

In the data the capitalized umlauts are passed correctly - they are just displayed incorrectly in the text input field. I don't want this behavior.

What I tried so far, but didn't trigger any effect:

• autocomplete="off" in the input field
• spellcheck="false" in the input field
• <tag autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" /> in the index.html
• different language settings in the browsers.
• different language settings in the operating system (Windows 11)

Answer 1

Apparently, this problem is due to the display of the character set in Chrome and Edge. In input fields, the capitalized umlauts seem to be cut off at the top.

One workaround for me was to change the font-family. Is not satisfactory though.

Link to a helpful answer: https://github.com/IBM/plex/issues/191