CSS和jquery.tools标签的标签包装行为
||
我在使用jquery工具选项卡的Chrome中出现一些奇怪的包装行为:
当浏览器较大时,它们都只会显示在一行中。
选项卡的CSS是:
/* root element for tabs */
ul.tabs {
margin:0 !important;
padding:0;
height:30px;
border-bottom:1px solid #666;
}
/* single tab */
ul.tabs li {
float:left;
padding:0;
margin:0;
list-style-type:none;
}
/* link inside the tab. uses a background image */
ul.tabs a {
float:left;
font-size:13px;
display:block;
padding:5px 30px;
text-decoration:none;
border:1px solid #666;
border-bottom:0px;
height:18px;
background-color:#efefef;
color:#777;
margin-right:2px;
position:relative;
top:1px;
outline:0;
-moz-border-radius:4px 4px 0 0;
}
ul.tabs a:hover {
background-color:#F7F7F7;
color:#333;
}
/* selected tab */
ul.tabs a.current {
background-color:#ddd;
border-bottom:1px solid #ddd;
color:#000;
cursor:default;
}
/* tab pane */
.panes div {
display:none;
border:1px solid #666;
border-width:0 1px 1px 1px;
min-height:150px;
padding:15px 20px;
background-color:#ddd;
}
此页面的总体结构为:
有人对我如何混合解决方案或解决方案有任何建议吗?
没有找到相关结果
已邀请:
2 个回复
坛沤疲撑拆
中添加了
来清除浮动元素(标签)。 我加了ѭ3来弥补这个问题,在ѭ4上有这个问题:
。
使一个标签比其他标签高
,但是
边框的
确保高度一致。 当您浮动不同高度的元素时,就会遇到这类问题。 参见:http://jsfiddle.net/me9XZ/3/ 我在Chrome / Firefox中进行了测试。
棠媳鳖