Question

我做错了什么或Firefox不支持border-bottom属性？我正在尝试将1px dotted底部边框添加到<li>标记，该标记适用于除Firefox之外的所有浏览器。

我正在使用CSS类进行推荐页面。 list-style-image: url(../images/quote-left.png);用于打开的块引用，在段落结束后有引用权限来关闭引号。

HTML：

<div class="testimonial">
<ul>
    <li>testimonial 1. <img src="images/quote-right.png" /><br />
    <cite>-xxx</cite>
    </li></ul>
    <ul>
    <li>testimonial 2. <img src="images/quote-right.png" /><br />
    <cite>-xxx</cite>
    </li></ul>
    <ul>
    <li>testimonial 3. <img src="images/quote-right.png" /><br />
    <cite>-xxx</cite>
    </li></ul>
    <ul>
    <li>testimonial 4. <img src="images/quote-right.png" /><br />
    <cite>-xxx</cite>
    </li></ul>
</div>

CSS：

div .testimonial ul li {
    list-style-type: none;
    list-style-image: url(../images/quote-left.png);
    list-style-position: 0 0;
    font-family: Calibri, Arial, Helvetica, sans-serif;
    text-align: left;
    font-size: 1em;
    line-height: 1.4em;
    font-weight: normal;
    color: #000;
    border-bottom: 1 dotted #C0C0C0;
    padding: 0 0 20px 0;
    margin: 20px 0 0 0;
}

Answer 1

起初，我很惊讶Firefox无法找出CSS规则的默认单位，因为你没有在边框的宽度上指定它。但是，正如评论中所提到的（强调我的）：

假设如果在那里不允许无单位值，则将该属性解除为无效。如果其他浏览器假设px，则页面处于怪异模式。

尝试使用它来解决您的问题：

border-bottom: 1px dotted #C0C0C0;

注意添加的px位。现在，border-bottom也适用于Firefox。有关实时演示，请参阅this fiddle。

<li>标签的border-bottom在Firefox中不起作用，但在所有其他浏览器中都可以使用</li>

1 个答案: