Edgeでul要素のリストマークが誤表示される問題について

Edgeブラウザについて、CSSファイルでul要素に対して、list-style: noneを設定したのにリストマークが表示されるという事がありました。Bootstrapを使用しており以下はその再現です。

ハンバーガーアイコン
Edgeでナビバーが上画像のように隠された状態でブラウザを再読み込みして横幅を広げると、

崩れたナビバー
リストマークが表示されナビバーが崩れてしまいます。
上記のサイトではBootstrap3を使用していますが、4についても同様の現象を確認しています。

javascript – Internet Explorer 11 ignores list-style:none on the first load – Stack Overflow

上記のリンク先によるとIEでも起こる現象のようですが、当方が確認したのはEdgeのみで、CSSファイルではなくhtmlタグの方に直接styleを設定する事で解決しました。

<!-- ナビバーの修正 -->
<ul class="nav navbar-nav" style="list-style: none">
    <li id="index"><a href="index.php">Top</a></li>

    <!-- 以下略 -->
</ul>

コメントを残す

メールアドレスが公開されることはありません。