当前位置：文江博客话题详情

IE7 渲染输入文本不正确

发布于 2024-11-26 10:56:38 字数 1859 浏览 4 评论 0原文

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

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

然而，这个问题是我无法解决的问题。

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

正确的文本框

不正确Text Box

我尝试过使用 IE NetRenderer 以及 Adobe BrowserLabs，但没有成功。我还运行了 W3 验证器，但只收到与我的 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 引起的？

原文

One of my users is having this weird problem that I cannot seem to replicate or figure out the issue.

He has reported a lot of various problems of images not showing up correctly which I was able to fix by adding "px" to the width and height. It seems like IE7 was not able to set a default unit.

However, this problem is one that I cannot figure out.

Here are the two images, the blurry one being his (cell phone image).

Correct Text Box

Incorrect Text Box

I have tried using IE NetRenderer as well as Adobe BrowserLabs with no luck. I have also ran the W3 Validator and only got errors relating to my Facebook Like button code.

Here is the code for the chat:

  <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;" />   <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>

I am starting to wonder if this issue could be caused by the padding-left being used?

分享到QQ

分享到微博