0

当我在面包屑中输入长文本时，它们会中断..有什么想法吗？

随意小提琴：http: //jsfiddle.net/neodjandre/pbEpG/

.breadsmall ul{margin:0px;}
.breadsmall ul li{display:inline-block;height:20px;line-height:20px;width:100px;text-indent:10px;text-align:center;position:relative;margin:5px 1px 0 0;}
.breadsmall ul li:before{content:" ";height:0;width:0;position:absolute;left:-2px;z-index:0;border-color:transparent transparent transparent #fff;border-style:solid;border-width:10px 0 10px 10px;}
.breadsmall ul li:first-child:before{border-color:transparent;}
.breadsmall ul li a:after{content:" ";height:0;width:0;position:absolute;right:-10px;z-index:10;border-color:transparent transparent transparent #e8e8e8;border-style:solid;border-width:10px 0 10px 10px;}
.breadsmall ul li a{display:block;background: #e8e8e8;font-family:Century Gothic, sans-serif;font-size:1em;color:#666666}
.breadsmall ul li a:hover{background:#1f1f1f;color:#eaeaea;}
.breadsmall ul li a:hover:after{border-color:transparent transparent transparent #1f1f1f;}
.breadsmall ul li.active a{background:#1f1f1f;z-index:100;color:#eaeaea;}
.breadsmall ul li.active a:after{border-left-color:#1f1f1f;}
4

1 回答 1

3

使用min-width: 100px;代替. width: 100px;_<li>

.breadsmall ul li {
    min-width: 100px;   
}

看起来像这样：http: //jsfiddle.net/MRSallee/pbEpG/1/

那场比赛你想要什么？

于 2013-04-22T01:23:15.057 回答