Edge input placeholder not aligned with text

2019-07-12 19:41发布

In all other browsers, the placeholder of my input of type text starts where the cursor is flickering. However, in Microsoft Edge, the placeholder text appears ahead of the cursor. Is there any way to fix this?

Expected result: enter image description here

Edge result: enter image description here

1条回答
forever°为你锁心
2楼-- · 2019-07-12 19:59

It seems I found the answer (the sooner I asked it here...)

The problem is with the text-indent property. Somehow in Edge it moves the cursor at an inequal distance to the placeholder. Using

padding-left: 10px;

instead of

text-indent: 10px;

solves the isse. Here's a working fiddle with both scenarios: jsfiddle

查看更多
登录 后发表回答