サブカテゴリメニューの位置をドロップダウンします。

Question

ウェブサイトの4番目のサブメニューがリンクの横に表示されないため、クライアントのウェブサイトでメニューを修正するように求められました。ウェブサイトはhttps://www.abrimagery.com/store/です。ボロシリケートFlameworking> 33 COEボロシリケートFlameworking> 33 COEカラーロッドフリット＆チューブ> ACMEカラーグラスに行くと、私の言いたいことが分かります。サブメニューが固定された場所にポップアップし、その上にマウスを置くことはできません。私は相対的な位置に変更することができ、メニューはリンクの隣にポップアウトされますが、リンクの下に空白が残されます。いくつかの研究の後、私はそれが相対的な位置付けの仕組みであることを発見しました。誰かがこれを見て、私が頭の中にいるように正しい方向に向けることができますか？私はGoogleを検索しようとしていると店のテンプレートのためのいくつかのドキュメントが見つかりましたが、それは全く役に立たなかった。私はMSPのハードウェア技術者で、これを修正できるかどうか尋ねられました。なぜなら、私は大学でいくつかのWebデザインクラスを取ったと言いました。私は大いに助けていただければ幸いです。

#drop-box, .drop-box-subcat, .drop-box-subsubcat, .drop-box-3subcat, .drop-box-4subcat{ 
position:absolute; 
left:0px; 
z-index:100; 
display: none; 
text-align:left; 
padding:0; 
top:57px; 
border: none; 
width:auto; 
background: #fbfbfb; 
padding:20px 15px 20px 15px; 
-moz-box-shadow:0px 10px 15px 2px #727272; 
-webkit-box-shadow: 0px 10px 15px 2px #727272 ; 
box-shadow: 0px 10px 15px 2px #727272 ; 

} 

.drop-box-subsubcat, .drop-box-3subcat, .drop-box-4subcat{left:200px;top:-7px;} 
.drop-box-4subcat{top:50px;} 

.cat-name, .sub-cat-name, .subsub-cat-name{ 
display: block; 
float:left; 
position:relative; 
left:0px; 
top:0px; 

Answer 1

あなたは.drop-box-4subcat

.drop-box-4subcat { 
    top: inherit; 
    margin-top: -50px; 
} 

にこれを適用しようとすることはできますが、それは、他の4カテゴリのドロップダウンに役立ちます願っています！

Answer 2

サブメニューの左の姿勢にはピクセルを使用しないでください。ファイルunishop.css行のCSSルール以下の変更683

.drop-box-subsubcat, .drop-box-3subcat, .drop-box-4subcat { 
    left: calc(100% + 15px); 
    top: -7px; 
}