Question

我有一种导航类型包含在'pill'种类中。

我需要pill（周围容器）根据导航中的元素数量自动调整大小。

我的pill容器位于页面的中心位置，因此我认为float: left;或float: right;不起作用，因为它会覆盖margin: 0 auto;。

以下是我的问题示例：http://jsfiddle.net/TylerB/EU6XG/1/

如何根据列表中的导航项数量设置此div元素的宽度？

Answer 1

只需添加display: table

即可

DEMO http://jsfiddle.net/kevinPHPkevin/EU6XG/6/

.tabset-container {
    margin: 0 auto;
    position: relative;
    top: 25px;
    z-index: 1;
    background: transparent;
    text-align: center;
    display:table;
}

同时将overflow: hidden添加到标签中，以便圆角仍显示

.tabset {
        overflow:hidden;
}

Answer 2

我正朝着jQuery的方向前进 - fiddle（获取宽度并通过.css()传递） display: inline-block

上的.tabset

根据内部列表元素的数量调整div宽度

2 个答案: