1

正常に動作するシンプルな CSS ベースのドロップダウン メニューがあります。しかし、ここでは、同様に表示されるサブメニューを追加したいと考えています。サブメニューが表示されたときにメインメニューリストの高さが拡大することを除いて、すべてが正常に機能しています。

http://jsfiddle.net/GzfFs/

.cascade_content {
/* cascading sub menu */
display: none;
z-index: 103;
position: relative;
background: #FFFFFF;
border: 1px solid #8C8C8C;
padding: 10px 0px 10px 0px;
width: 190px;
left: -192px;
top: -26px;
-moz-box-shadow: 0 2px 6px 0px #8C8C8C;
-webkit-box-shadow: 0 2px 6px 0px #8C8C8C;
box-shadow: 0 2px 6px 0px #8C8C8C;

}

注: サブメニューの position:relative が原因のようです... ただし、それを position:absolute に変更すると、正しい場所に表示されないという問題が発生します。CSS の経験が豊富な方は、これが単純な問題であることに気付くと思います。ご協力いただけると幸いです。

4

1 に答える 1

1

http://jsfiddle.net/GzfFs/1/

.dropdown_content li {position: relative}
.cascade_content {position: absolute}

You may also need to move your ULs inside the LIs to get positioning where you want it.

于 2013-02-08T17:01:52.553 に答える