在开始输入之前，输入字段上的CSS文本缩进不会更新插入符号的位置 [英] CSS text-indent on input field doesn't update the caret position until you start typing

问题描述

当我在CSS中使用text-ident属性时，我希望看到的是当您将焦点放在文本输入区域时，文本光标图标/插入符号将缩进显示.但是看起来好像没有缩进，直到您键入第一个字符.唯一的解决方法是在输入元素上使用左填充，但是我想避免使用填充，因为我也在设置宽度，并且不想使用IE专用电子表格为IE实现填充修复.

此错误发生在Safari中.

有关我在说什么的图片，请参见下文.

当没有文字时，只要关注焦点，文字识别就不会影响插入符号的位置:

开始输入时，它会正确缩进:

键入然后删除您键入的内容后，它会从一开始就显示我希望它执行的操作(缩进尖号).

HTML:

 <输入类型="text"/> 

CSS:

  input {text-indent:10px;} 

解决方案

这是一个已确认的WebKit错误，最近已解决 https://bugs.webkit.org/show_bug.cgi?id=82688

您的Safari版本可能太旧，无法包含此修复程序.

改为使用padding-left.

When I use text-ident property in CSS, what I expect to see is when you focus into the text input area, the text cursor icon/caret will appear indented. But it appears as if it isn't indented until you type for first character. The only work around is to use left padding on the input element, but I want to avoid using padding because I am also setting a width and don't want to have to implement a padding fix for IE using an IE specific spreadsheet.

This bug happens in Safari.

See below for images of what I'm talking about.

On focus when there is no text, the text-ident doesn't affect the caret position:

When you start typing, it indents correctly:

After you type and then delete what you've typed, it displays what I want it to do from the beginning (indent the caret).

HTML:

<input type="text" />

CSS:

input   { text-indent: 10px; }

解决方案

It's a confirmed WebKit bug that has recently been resolved https://bugs.webkit.org/show_bug.cgi?id=82688

Your version of Safari may be too old for this fix to be included.

Use padding-left instead.

这篇关于在开始输入之前，输入字段上的CSS文本缩进不会更新插入符号的位置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！