自从IE9成为需求以来已经很长时间了，我有点生疏，所以我可以使用第二组眼睛。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" href="css/styles-b.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
</head>
<body>
<div id="v2-header">
<div id="v2-header-info">
<div class="v2-frame">
<a href="" class="v2-logo">Home</a>
<p class="v2-phone">Call to talk to one of our <em>Parts Specialists</em> <strong id="v2-phone-number">1<span>-</span>805<span>-</span>702<span>-</span>8365</strong></p>
<ul class="v2-header-links">
<li class="v2-header-links-1"><a href="">Help & Support</a>
<ul class="v2-header-dropdown">
<li><a href="" class="v2-button">Support Online — Chat Now</a></li>
<li><strong>Help & Support</strong></li>
<li><a href="http://www.buyautoparts.com/american-customer-support/" class="test2">USA Customer Care </a></li>
<li><a href="http://www.buyautoparts.com/order-support.html" class="test3">Order Support</a></li>
<li><a href="http://www.buyautoparts.com/product-support.html">Product Support</a></li>
<li><a href="http://www.buyautoparts.com/warranty.htm">Warranty Info</a></li>
<li><a href="http://www.buyautoparts.com/policies.htm" class="test4">Policies</a></li>
<li><a href="http://www.buyautoparts.com/faq/">FAQ</a></li>
<li><a href="http://www.buyautoparts.com/about.htm">About Us</a></li>
</ul>
<li class="v2-header-links-2"><a href="">Community</a>
<ul class="v2-header-dropdown">
<li><strong>Check Us Out</strong></li>
<li><a href="http://www.buyautoparts.com/web/index.aspx"><span>Blog</span></a></li>
<li><a href="http://www.buyautoparts.com/facebook/"><span>Facebook</span></a></li>
<li><a href="http://www.buyautoparts.com/linkedin/"><span>LinkedIn</span></a></li>
<li><a href="http://www.buyautoparts.com/twitter/"><span>Twitter</span></a></li>
<li><a href="http://www.buyautoparts.com/youtube/"><span>Youtube</span></a></li>
<li><a href="http://www.buyautoparts.com/googleplus/"><span>Google +</span></a></li>
<li><a href="http://www.buyautoparts.com/pinterest/"><span>Pinterest</span></a></li>
</ul>
</li>
<li><a class="v2-single" href="">How To</a></li>
<!--<li><a href="">Buyer's Guides</a></li>-->
</ul>
</div>
</div>
<div id="v2-header-action">
<div class="v2-frame">
<form action="" id="v2-search">
<p class="v2-search-cta">Try our new Parts Search</p>
<p class="v2-search-input">
<input type="text" name="" value="Try out our new search!" onClick="this.setSelectionRange(0, this.value.length)" />
</p>
<p class="v2-search-button">
<input type="submit" value="Search" />
</p>
</form>
<ul id="v2-header-account">
<li>
<a href="">Hello. Sign In. <strong>Your Account</strong></a>
<ul class="v2-header-dropdown">
<li><a href="" class="v2-button">Sign In</a></li>
<li><strong>Your Account</strong></li>
<li><a href="">Your Account Information</a></li>
<li><a href="">Your Orders</a></li>
<li><a href="">Track Packages</a></li>
<li><strong>Process Returns</strong></li>
<li><a href="">Return an Item</a></li>
<li><a href="">Return a Core</a></li>
</ul>
</li>
</ul>
<ul id="v2-header-cart">
<li>
<a href="">Your cart is <strong>Empty</strong></a>
<ul class="v2-header-dropdown">
<li>
<span class="v2-cart-qty">1</span>
<a href="" class="v2-cart-title">2002 Chevrolet Cavalier A/C Accumulator/Drier <span>2.2L and 8th VIN digit 4</span></a>
<span class="v2-cart-price">$39.00</span>
</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
<div id="v2-vehicle-selector">
<form action="">
<p class="v2-selector-label">Select Your Vehicle</p>
<p class="v2-selector-dropdown"><select name="" id="">
<option disabled="disabled" selected="selected">Select Year</option>
<option value=""></option>
</select></p>
<p class="v2-selector-dropdown"><select disabled="disabled" name="" id="">
<option disabled="disabled" selected="selected">Select Make</option>
<option value=""></option>
</select></p>
<p class="v2-selector-dropdown"><select disabled="disabled" name="" id="">
<option disabled="disabled" selected="selected">Select Model</option>
<option value=""></option>
</select></p>
<p class="v2-selector-submit"><input type="submit" value="Go ›" /></p>
</form>
</div>
</body>
</html>
将鼠标悬停在帮助＆amp;在IE9中支持，您会看到下拉列表位于搜索框下方。有趣的是，输入并非绝对定位，但其父级是。
答案 0 :(得分：1)
试试这个：
在搜索框中添加z-index：
<input type="text" name="" value="Try out our new search!" onClick="this.setSelectionRange(0, this.value.length)" style="z-index:-1" />
在悬停下拉列表中添加z-index：
#v2-header .v2-header-dropdown .v2-button:hover {
background-color: #faa100;
background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #f7891a), color-stop(100%, #ffae0d));
background-image: -webkit-linear-gradient(bottom, #f7891a 0%, #ffae0d 100%);
background-image: -moz-linear-gradient(bottom, #f7891a 0%, #ffae0d 100%);
background-image: -o-linear-gradient(bottom, #f7891a 0%, #ffae0d 100%);
background-image: linear-gradient(bottom, #f7891a 0%, #ffae0d 100%);
z-index: 9999;
}
/* line 91, ../sass/styles-b.scss */
#v2-header .v2-header-dropdown li {
padding: 1px 0;
z-index: 9999;
}