hrタグに :before と :after / IEとEdgeで問題が!

hrタグのラインに左右にアイコンを置いて装飾する際に、
beforeとafterで配置すると、何故かIEとEdgeで再現されませんでした。
ChromeやFirefoxは、意図した通りの動きをしてくれます。

こんなラインイメージ
● ——<hr>——- ●

解決策法

hrに対して、overflow:visible; を入れることで、IEやEdgeでも意図した表示になります。

参考

:before and :after to HR in Microsoft Edge and IE

  • このエントリーをはてなブックマークに追加
  • Pocket

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください