私たちはウェブサイトfabulouslanzarote.comを持っており、CSS3を使ってナビゲーションメニューを実装しています。 「The Resort」と「The Community」メニューオプションには のサブメニューがあります。CSS3カスケードメニューがChromeで動作しない
最近、Chromeでこれらのサブメニューにアクセスできないことが報告されています。トップレベルのリンクをクリックすると表示されますが、リンクの1つをクリックしようとすると表示されなくなります。
Googleは数か月でサイトを更新していないし、最後のデプロイメントの後に作業していたので、これはChromeのアップデートの結果でしょうか？ FirefoxとEdgeではメニューが正常に動作します。
Chromeでサブメニューが正しく機能しない原因を知っている人はいますか？
@Johannesが正しいです。メニューにはギャップがあり、カーソルを移動するとホバー状態が失われます。 ul.dropに透明な疑似要素を追加して、ギャップを埋めるようにして、カーソルの移動に合わせてホバー状態を維持してください。
ul.drop:after {
content: '';
position: absolute;
bottom: 100%;
left: 0;
right: 0;
height: 27px;
}
免責事項：私は通常、ハードコードされた値を使用することはお勧めしませんが、あなたのメニューは、すでにそれらを活用しています。だから私は27pxを選んだのです。それは他のハードコーディングされた値に基づいて適合します。
メインメニューの少し下にあると思います。マウスをゆっくりと移動させると（真ん中ではなく）、「ホバー」状態が緩やかになり、サブメニューが消えます。
私はそれらを少し上に移動し、その状況を避けるために少し上にその矢印を小さくします。