IE8和IE9之间的布局差异

我有一个网站（www.jamesalder.co.uk），它不能在IE8及以下版本中正确呈现。IE8和IE9之间的布局差异

这是在IE8： in IE8

而在IE9和其他一切： in IE9

正如你可以看到，搜索框已经从右上方移动到错误的地方。搜索框的HTML是：

<div id="header"> 
    <img src="/media/header_images/ts-hutton_2.jpg" title="Victorian Paintings at James Alder Fine Art" alt="Victorian Paintings at James Alder Fine Art" "=""> 
    <form id="search-form" action="/search"> 
      <label id="search-label">Search the Site</label> 
      <input type="image" src="/static/images/sign-up.gif" value="search" id="search-button"> 
      <input type="text" name="q" id="search-input"> 
    </form> 

</div>

它好像它是完全丢失了以下CSS，因为如果我禁用此CSS，它具有相同的效果：

#search-form { 
    position: absolute; 
    right: 0; 
    top: 0; 
    background-color: rgba(255, 255, 255, 0.6); 
    padding: 3px; 
}

IE9对表单上的CSS有什么问题？我应该把它放在一个div中吗？

至于那些决定不再漂浮的图片，我不知道。

是否有任何最佳实践或良好的资源，让网站在旧版本的IE中行为，还是应该使用条件？

来源

2013-11-02 eggbert

它实际上是由HTML格式不正确造成的。我有看起来像这样的标签：

<img src="/media/homepage_images/all-paintings-sale.jpg" 
    alt="All Victorian Paintings for Sale" 
    title="All Victorian Paintings for Sale" ">

注意“到了最后，这是造成一切跟随它被视为文本奇怪的是，IE9和其他一切固定的错误自动，但IE8及以下没。 “T。

来源

2013-11-03 22:48:57 eggbert

这不是特别离奇。浏览器历来以不同的方式处理HTML错误，因为错误处理直到最近才在HTML中被标准化。 –

-1

这可能是由<form>造成的。

将您的<form id="search-form" action="/search">元素放在div中。

<div id="header"> 
    <img src="..."/> 
    <div id="search-form"> 
     <form action="/search"></form> 
    </div> 
</div>

请尝试此操作。

来源

2013-11-02 11:10:18

-2

应用此CSS的....

/* Css for ie 8 */ 

#search-form { 
    position: absolute\0/; 
    right: 0\0/; 
    top: 0\0/; 
    background-color: rgba(255, 255, 255, 0.6)\0/; 
    padding: 3px\0/; 
} 

====================================================== 

/* Css for ie 9 */ 

:root #search-form { 
    position: absolute\0/IE9; 
    right: 0\0/IE9; 
    top: 0\0/IE9; 
    background-color: rgba(255, 255, 255, 0.6)\0/IE9; 
    padding: 3px\0/IE9; 
}

来源

2013-11-02 11:16:36

这是你的错误不是我的。你并不清楚你的问题。从下一次一定ü要问什么。 –

我不知道谁downvoted你为什么，但这不是这是一个很好的答案，因为它（1）没有解释任何内容，（2）使用丑陋和不必要的CSS“黑客”。这种黑客实际上并不是必需的，并且已经被长期折磨。取决于您的需求，存在更好的替代方案。 –

IE8和IE9之间的布局差异

回答

相关问题