Sebastianb
Sebastianb

Reputation: 2060

font-style: italic changing size of input on Chrome?

I'm trying to fix an issue on my inputs, where I change the style of the font to italic whenever the input is dirty. This works fine on Firefox. However on Chrome, when I apply font-style: italic; to a text input with, for instance, size="5", the input repaints itself with a different width.

You can check a basic example here: https://codepen.io/anon/pen/aeNoBV

Just remove the style of the input.

Is this a bug on Chrome, or am I missing something?

Upvotes: 0

Views: 297

Answers (1)

Henfs
Henfs

Reputation: 5411

The size attribute on input causes input width calculation that depends on the character font on Chrome.

Check this answer.

I'd recommend to use another method for the input like width itself that regardless of the font-style will not be modified.

Upvotes: 1

Related Questions