Question

我的css手风琴菜单有问题......

我有一个漂亮的滑块，如下所示： http://jsfiddle.net/LedZep257/hDzyH/1/

但是lis的间距不是很好，这意味着某些项目没有完全显示。

当我使用内联块时，间距是正确的，但它会占用整个滑块： http://jsfiddle.net/LedZep257/hDzyH/

任何人都可以帮助/有没有人有任何想法如何解决这个问题？

Answer 1

我认为你不能在不同的措施中设置转换，我认为“自动”和“％”是不同的衡量标准，如果你遇到太多麻烦，你可以只使用一种措施来设置转换。你真的需要做到这一点，为什么不使用像“em”meaby这样的另一种措施来修复它。

e.g。

.horizontalaccordion>ul>li
{
display: inline-block;
overflow: hidden;
float: left;
margin: 0;
padding: 0;

list-style: none;
width: 8em; /*I was here*/
height: 40px;
background: -webkit-gradient(linear, left top, left bottom, from(#454545), to(#000000));
transition: width 0.6s ease-in-out;
-moz-transition: width 0.6s ease-in-out;
-webkit-transition: width 0.6s ease-in-out;
-o-transition: width 0.6s ease-in-out;
}

.horizontalaccordion>ul>li>h3
{
display: inline-block;
float: left;
margin: 0;
padding: 10px;
padding-left:19px;
padding-right:18px;
height: 19px;
width: 8em; /*I was here*/
border-left: none;
font-family: Arial, Helvetica, sans-serif;
text-decoration: none;
color: #000;
background: -webkit-gradient(linear, left top, left bottom, from(#999999), to(#cccccc));
white-space: nowrap;
filter: progid;
-ms-filter: progid;
}

.horizontalaccordion>ul>li:hover
{
overflow: hidden;
width: 60em; /*I was here, I just set 60em for example*/
}

.horizontalaccordion:hover li
{

    width: 0em; /*I was here*/
}

CSS Accordion +内联块问题

1 个答案: