jsFiddle에서 볼 수있는 문제가 있습니다.
하위 메뉴의 너비를 수정하는 방법은 무엇입니까? 하위 메뉴 요소의 너비는 동적이어야합니다.
CSS의 일부
.contextMenu, .contextMenu ul {
margin: 0;
padding: 2px 0;
list-style-type: none;
background: white;
border: 1px solid #bababa;
font-size: 13px;
position: absolute;
}
.contextMenu li {
/**...**/
position: relative;
}
/**...**/
.contextMenu li ul {
left: 100%;
z-index: 1000;
top: -3px;
display: none;
}
.contextMenu li:hover ul {
display: inline-block;
}
/**...**/
HTML
<ul class="contextMenu">
<li class="click_me">Some elemetn</li>
<li class="stripe"></li>
<li>
Some 2
<span>»</span>
<ul><li class="click_me">Some 2.1</li></ul>
</li>
<li>
Some 3
<span>»</span>
<ul>
<li>
some 3.1
<span>»</span>
<ul><li class="click_me">Some element 3.1.1</li></ul>
</li>
</ul>
</li>
</ul>
추신 : 문법 오류로 인해 죄송합니다.
white-space : nowrap
이를 위해 사용할 수 있습니다 .
.contextMenu li {
white-space:nowrap;
}
바이올린을 확인하십시오 :
http://jsfiddle.net/7qV2H/2/
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다