Bootstrap中的面包屑在IE中重叠

时间:2013-07-25 19:52:40

标签: internet-explorer layout twitter-bootstrap

我正在使用以下代码为Bootstrap创建一个针对每个规范的痕迹路径:

        <div class="navbar-inner">
            <ul class="breadcrumb pull-left">
                <li><a href="#">Home</a> <span class="divider">/</span></li>
                <li><a href="index.html">Leave Management</a> <span class="divider">/</span></li>
                <li><a href="searchLeave.html">New Leave or Call Log</a> <span class="divider">/</span></li>
                <li class="active">Search Results</li>
            </ul>
            <ul class="nav pull-right" role="navigation">
                <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Packages <span class="caret"></span></a>
                    <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
                        <li><a href="#">package 1</a></li> 
                        <li><a href="#">package 2</li>
                        <li><a href="#">package 3</a></li>
                    </ul>
                </li>
                <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Leave Management <span class="caret"></span></a>
                    <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
                        <li><a href="index.html"><i class="icon-search"></i> Nav item 1</a></li>
                        <li><a href="#"><i class="icon-edit"></i> Nav item 2</a></li>
                        <li><a href="#"><i class="icon-inbox"></i> Nav item 3</a></li>
                                                </ul>
                </li>
                <li><a data-toggle="modal" role="button" href="#helpModal">Help</a></li>
                <li><a href="#">Logout</a></li>
            </ul>
        </div>

在IE中,我正在显示“Home / Leave Management /”正常显示,但是,第三个(活动)项目与前一个级别显着重叠(搜索结果中的“S”,从'm开始) “在管理中。”无论我放在那里的价值都没关系,面包屑永远不会在第二层之外正确显示。

有人可以帮忙吗?

更新:我编辑了我的代码以包含更多问题。实际问题区域是ul.breadcrumb

1 个答案:

答案 0 :(得分:5)

Here is a logged bug听起来与您的问题大致相同。

建议的解决方案是添加此...

.breadcrumb li {
    margin-right: 1px;
}