CSS Аккордеон + встроенный блок вопрос

Question

У меня возникли проблемы с моим меню аккордеон CSS ...

У меня есть созидатель хороший ползунок, как показано здесь: http://jsfiddle.net/LedZep257/hDzyH/1/

но лис не разнесены что означает, что некоторые элементы не отображаются полностью.

Когда я использую встроенный блок, шаг является правильным, но гадость вверх весь ползунок: http://jsfiddle.net/LedZep257/hDzyH/

Может кто-нибудь помочь/Кто-нибудь есть какие-либо идеи, как это исправить?

Answer 1

Я думаю, что вы не можете установить переход в разных измерениях, и я думаю, что «auto» «%» является различной мерой, вы можете использовать только одну меру для установки перехода, если у вас слишком много проблем и вам действительно нужно это сделать, почему бы вам не использовать другую меру типа «em», которая бы исправила ее.

например.

.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*/ 
}