CSS Issue in IE7 and IE8 - text-indent on field

Question

Is it possible to make IE7 and IE8 respect the text-indent css property on an input field?

Here's my code

<!DOCTYPE html>
<html>
<body>
        <input type="text" style="text-indent:100px; display:block;" value="Test indent" />
</body>
</html>

When you first load the page in IE8, the text is NOT indented. You can "activate" the text-indent property by focussing in on the text field and typing into it (ie. trigger the onchange event).

How do I make IE7 and IE8 respect the text-indent of an input text element on page load instead of on input.onchange event?

ShibinRagh · Accepted Answer

in normal case input tag text-indent does not work in ie6 and ie7 If we add lineheight:1px it will work all browser

Text-indent will work all browser

<input type="text" style="text-indent:-100px; display:block; line-height:1px;" value="Test indent" />

Text-indent not will work ie7 and ie6 browser

<input type="text" style="text-indent:-100px; display:block;" value="Test indent" />

demo

http://jsfiddle.net/KczMR/1/

CSS Issue in IE7 and IE8 - text-indent on <input type="text"> field

Tags:

css

internet-explorer-8

John

1 Answers

ShibinRagh

Recent Activity

Donate For Us