IE 7/8 中文本输入的文本缩进替代答案

【问题标题】：text-indent alternative for text inputs in IE 7/8IE 7/8 中文本输入的文本缩进替代
【发布时间】：2012-11-07 04:58:39
【问题描述】：

这是我的 jsFiddle 示例：

http://jsfiddle.net/jsplashindia/LYUA5/1/

这是我的 HTML 和 CSS：

<html>
<head>
<style type='text/css'>
    .testStyle {
    text-indent:30px;            
}
</style>

</head>
<body>

    <input type="text" class="testStyle">

</body>
</html>

基本上我需要像这样在我的文本输入中为文本缩进：

但是，在 IE 7 和 IE 8 中，我得到以下行为：

我需要去掉文本输入字段的前导空格。有没有使用 text-indext 的替代方法，以便在 IE7/8 和所有其他浏览器中获得预期的行为？

【问题讨论】：

标签： html css internet-explorer-8 cross-browser internet-explorer-7

【解决方案1】：

添加float:left

.testStyle {
    text-indent:30px;
    float:left      
}

DEMO

或者

使用padding-left

DEMO 2

【讨论】：