3

我在网上阅读过关于精灵和 IE8 的一百万个问题,但是,它们似乎都处理了精灵根本没有出现的问题。我的出现了,它只是显示了错误的精灵。它在所有其他浏览器中都能正常工作。

这是CSS

div.searchForm input[type=text] {
border: 0;
padding: 0 10px;
margin: 0;
background: url(../img/sprite.png) 0 -125px no-repeat;
background-size: 115% 235px;
width: 600px;
height: 30px;
float: left;
font-size: 12px;
color: #fff;
-webkit-appearance: none;
-webkit-border-radius: 0;
}

和html:

    <section id="secondary6">
    <h1 class="hidden">Search</h1>
    <div class="clearfix">
        <div class="grid_4">
            <nav class="grid_2 secondary">
                <h1 class="hidden">Search Secondary Navigation</h1>
            </nav>
            <div class="searchForm">
                <input type="text" placeholder="search">
                <input type="button">
                <input type="submit" class="hidden" >
            </div>
        </div>
    </div>
</section>

基本上你点击搜索按钮,它会显示一个应该隐藏的搜索栏。就像我说的它适用于其他浏览器。

4

2 回答 2

3

IE8 不支持背景大小(请参阅https://developer.mozilla.org/en-US/docs/Web/CSS/background-size#Browser_compatibility),所以这就是您必须解决的问题。根据您的需要,您可以尝试使用 IE7.js(适用于其他版本的 IE)或条件注释来调整 IE8 的图像位置。或者,只需确保您的原始图像不需要重新调整大小。

于 2013-07-09T21:11:29.287 回答
1

当您将类或 ID 分配给特定的文本输入字段时会发生什么?

例如..

 div.searchForm input.classInput {
   /* css code here */
 }

还 ...

..元素表单标签包装器、表单名称、表单操作在哪里?

输入字段不应以您呈现的方式驻留在文档中..没有表单标签..

哪个软件实际为您生成了此代码?是织梦者吗?


有效 HTML 输入表单的基本和正确示例..

<form id="formID" name="formName" method="post" action="#">
 <input type="text" name="textUno" value="" />
 <input type="text" name="textDue" value="" />
 <button type="submit" name="do_processing"> Go! </button>
</form>
于 2013-07-09T21:11:44.113 回答