Question

所以我有两个这样的Div：

<div id="first_content">
    <ul>
      <li>This</li>
      <li>text</li>
      <li>should</li>
      <li>be</li>
      <li>displayed</li>
      <li>in</li>
      <li>one</li>
      <li>line</li>
    </ul>
</div>

<div id="second_content">
    <ul>
      <li>This</li>
      <li>text</li>
      <li>should</li>
      <li>be</li>
      <li>displayed</li>
      <li>in</li>
      <li>one</li>
      <li>line</li>
    </ul>
</div>

和CSS：

#first_content, #second_content ul {
    list-style: none;
}

#first_content, #second_content ul li {
    display: inline;
}

它不起作用（至少在Firefox 34上）。样式仅适用于一个ID。

当我删除其中一个ID选择器时，另一个工作正常。

我想它应该有用吗？什么错了？

Answer 1

尝试：

#first_content ul, #second_content ul {
    list-style: none;
}

#first_content ul li, #second_content ul li {
    display: inline;
}

如果您尝试选择两个容器的ul和li，则需要使用两个选择器指定它。

Answer 2

基本CSS

.foo, .bar { ... }

是两个独立的选择器链。你有：

#first-content, #second_content ul
     ^--- applies to <div id="first-content">
                        ^^^^^^^^^^--- applies to any <ul> inside <div id="second-content">

<div>代码没有list-style，因此您的第一条规则对第一个<div>集合没有做任何事情。对于您的其他规则集，display-inline将应用于first-content的父div和<li>区域中的second-content标记。

Answer 3

这是一些css：

#navcontainer ul
{
margin: 0;
padding: 0;
list-style-type: none;
text-align: center;
}

#navcontainer ul li { display: inline; }

#navcontainer ul li a
{
text-decoration: none;
padding: .2em 1em;
color: #fff;
background-color: #036;
}

#navcontainer ul li a:hover
{
color: #fff;
background-color: #369;
}

还有一些HTML：

<div id="navcontainer">
<ul>
<li><a href="#">Milk</a></li>
<li><a href="#">Eggs</a></li>
<li><a href="#">Cheese</a></li>
<li><a href="#">Vegetables</a></li>
<li><a href="#">Fruit</a></li>
</ul>
</div>

这些应该产生预期的效果。资料来源：http://css.maxdesign.com.au/listutorial/horizontal_master.htm

Answer 4

多个id串联在Firefox中从未起作用。例如，我正在使用67.0（64位），并且以下CSS可以按预期工作：

#noDisplay {
   display: none;
}

#togForm {
   display: none;
}

...但是，如果我将其连接起来，如下图所示，则它不起作用（一个id有效，另一个id不起作用），并且一直都是这种情况。

#noDisplay,#togForm {
   display: none;
}

我知道有时候原因是因为条目冲突，但是显示：无本身？ -如果可以，可以争论！

多个ID选择器不起作用

4 个答案: