Question

我目前有一个搜索的“按钮”, 我坐在一个文本框的边上, 如下图所示, 这使铬和火狐变得不错。

""https://i.sstatic.net/coKIx.png" alt="此处输入图像描述"/ >

在IE9中,它变成这样。

“https://i.sstatic.net/o4mSv.png' alt=“IE Render”/> https://i.sstatic.net/o4mSv.png' alt=“IE Render”/>

有人遇到过类似的问题吗?

搜索按钮的 CSS 是 :

    .txtSearchBtn
{
    display: inline-block;
    width: 16px;
    height: 16px;
    position: relative;
    left: -20px;
    top: 5px;
    cursor: hand;
    cursor: pointer;
    background-image: url(../Images/magnifier.png);
}

错误似乎与我的页面被放在花哨箱内有关。 IE9 处理内设区块的方式与花哨箱外不同。

EDIT 2: 找出了问题。我的最大宽设置没有足够的空间用于文本框和图像, 尽管我正在将图像 - 20px 移动到左边, 所以IE将它放在上面的线上。

Answer 1

IE 对内区块的 IE 支持在 IE8 + 中得到的更好。这听起来像是您在兼容模式下生成的, 这基本上意味着将这页变成您是 IE7 (或更糟 - Quirks 模式 ) 。

您正在声明 DOCTYPE 吗? 请尝试将它添加到您的 html 文件顶部 :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

这应该迫使它使用 IE9 映射, 从而可以正确进行内嵌屏蔽。

Answer 2

这是一个问题,因为 IE 无法识别属性

display: inline-block;

IE 探索器将将其内嵌显示为内嵌, 并实现您给内容布局所需的预期效果

zoom: 1;
display: inline;

或类似。

这篇文章对我很有帮助, 检查一下,完全明白我想说什么!

http://flipc.blogspot.co.uk/2009/02/damn-ie7-and-inline-block.html

如果你只是试图掩盖你的背部直至IE9和不少于IE9, 那么@Porco有覆盖正确的DOCTYPE声明。

友情链接