0

我有一个无序列表，在每个列表项的左侧显示项目符号。在 FF/IE 中，项目符号显示一半。在 Chrome 中，它们根本不显示。通过添加margin-left: 5px到<li>我可以让他们出现。

但我真正想了解的是它们为什么被隐藏。我宁愿治疗原因而不是症状。我无法在小提琴中重现，所以这里是该页面的链接。我已将其尽可能简化，并在页面中提供了解释。

http://help.projectorpsa.com/display/doc432m/Test

我正在使用一个名为 Confluence 的 CMS 系统，因此我对 html 标记没有太多控制权。无论如何，这是标记。

<div class="panelMacro">
    <table class="infoMacro">
        <tbody>
            <tr>
                <td>
                    <div class="panel" style="background-color: transparent;border-color: transparent;border-width: 1px;">
                        <div class="panelContent" style="background-color: transparent;">
                            <ul>
                                <li>A - There is no bullet displayed for this list. If I add margin-left: 6px to this &lt;li&gt; then I can see it. But I don't understand why this is happening. What is the bullet hiding behind?</li>
                                <li>B</li>
                                <li>C</li>
                                <li>D</li>
                            </ul>
                        </div>
                    </div>
                </td>
            </tr>
        </tbody>
    </table>
</div>
4

4 回答 4

3

因为这条规则：

table.infoMacro ul {
padding-left: 0px;
}

要么摆脱它，要么将填充增加到 6px。

于 2013-04-04T15:07:20.983 回答
1

这就是 custom.css 第 33 行的原因：

table.infoMacro ul {
padding-left: 0px;
}

尝试覆盖这个

于 2013-04-04T15:08:15.987 回答
0

尝试添加list-style-position: inside;到您的ul

于 2013-04-04T15:06:51.123 回答
0

如果您逐步浏览 html，您会看到您 <div class="panel">的设置为溢出：隐藏；

将其更改为溢出：可见；你应该很高兴。

于 2013-09-16T18:57:18.800 回答