IE7 不正确地渲染输入文本答案

【问题标题】：IE7 Rendering Input-Text IncorrectlyIE7 不正确地渲染输入文本
【发布时间】：2011-07-26 02:55:10
【问题描述】：

我的一个用户遇到了这个奇怪的问题，我似乎无法复制或找出问题所在。

他报告了很多图像无法正确显示的各种问题，我可以通过在宽度和高度上添加“px”来解决这些问题。好像 IE7 无法设置默认单位。

但是，这个问题我想不通。

这是两张图片，模糊的一张是他的（手机图片）。

我尝试过使用 IE NetRenderer 和 Adobe BrowserLabs，但没有成功。我还运行了 W3 Validator，只收到与我的 Facebook Like 按钮代码相关的错误。

这是聊天的代码：

  <div id="content">
    <h1>Chat</h1>
        <div style="padding-left: 100px;">
        <div class="wrapper_product"> 
            <div class="wrapper_product_inner">
                <div style="padding-left: 5px; padding-right: 5px;" id="usersOn">
                </div>
                <br />
            </div> 
        </div>
<br />
        <div class="wrapper_product"> 
            <div class="wrapper_product_inner">
                <div style="padding-left: 5px; padding-right: 5px; padding-bottom: 5px; overflow: auto; height: 300px;" class="chatActual" id="actual"><!--COMMENTEED OUT BECAUSE NOT NECESSARY!--></div>

            </div> 
        </div>
        <br />
        <div style="padding-left: 100px;">
    <input type="text" name="message" id="message" value="" style="float:left; padding:6px 10px; width:292px; height:14px; border:none; background:url(http://www.mydomain.com/images/bg-input-2.gif) no-repeat left top;" />&nbsp;&nbsp;&nbsp;<input type="image" name="post" value="Post" id="sendMessage" style="float:left; padding-left: 5px;"  src="http://www.mydomain.com/images/post.png" alt="Post" />
    </div>
    </div>
<!--JAVASCRIPT CODE COMMENTED OUT-->
</div>

我开始怀疑这个问题是否是由使用 padding-left 引起的？

【问题讨论】：

标签： internet-explorer rendering textinput

【解决方案1】：

我的结论是 IE 不喜欢带图像的输入文本框，只是恢复使用普通的输入文本框。

【讨论】：