Question

我正在使用最后一个子选择器来填充导航栏中的间隙，除了最新版本的IE之外，它在大多数浏览器中都能正常工作。这有什么解决方案或后备吗？

ul.dropdown li:last-child{padding-right:20px}

HTML：

<nav id="main-navigation">

        <ul class="dropdown">
            <li><a href="#">Digital Printing      <span><span></a>
        <ul class="sub-menu">
                 <li><a href="#">Bureau Services</a></li>
                 <li><a href="#">Variable Data</a></li>
                 <li><a href="#">Communication Devices</a></li>
                 <li><a href="#">Large Format</a></li>
            </ul>
        </li>
        <li><a href="#">Email & SMS Broadcasting</a>
            <ul class="sub-menu">
                <li><a href="#">Data List Management</a></li>
                <li><a href="#">Campaign Planning</a></li>
                 <li><a href="#">Email Build</a></li>
                 <li><a href="#">Broadcast</a></li>
                 <li><a href="#">Track & Learn</a></li>
            </ul>
        </li>
        <li><a href="#">Mailing & Fulfilment</a>
            <ul class="sub-menu">
                 <li><a href="#">Direct Mail</a></li>
                <li><a href="#">Fulfilment</a></li>
                 <li><a href="#">Postal Services</a></li>
            </ul>
        </li>
        <li><a href="#">Consultancy</a>
            <ul class="sub-menu">
                 <li><a href="#">Print Management</a></li>
                 <li><a href="#">Cross Media Services</a></li>
                 <li><a href="#">Stragety Execution</a></li>
            </ul>
        </li>
        <li><a href="#">Blog</a></li>
    </ul>
   </nav>

Answer 1

msdn网站说，IE9中的最后一个孩子选择器是available and works。但是如您所知，IE使用different box model。

也许这会导致问题。尝试添加具有边距的ie特定行：

ul.dropdown li:last-child{padding-right:20px; margin-right:20px\0/IE9;}

Answer 2

IE7和IE8不支持last-child，但它们确实支持first-child。只需要改变编码，改变第一个而不是最后一个。

最后一个子选择器 - IE中的问题

2 个答案: