テキストの左右に線を引く [IE8対応]

001

先日仕事で設置する必要があり、コリスさんの記事を参考にしましたが、IE11でバグが発生してすぐには使えませんでした。

というわけで、htmlタグを組み合わせた古いやり方でIE8~11まで表示させます。
万能性はないので、あくまで時間がないときの応急処置です。

目次

検証済みブラウザとOS

  • IE 8~
  • Firefox
  • Google Chrome
  • Safari
  • Windows 7
  • OS X El Capitan
  • iOS 9
  • Android 4.1 / 5 / 6

 

要点とコード

code

  • div / span に relative を、b に aboslute を指定して、擬似的に線のように見せる
  • テキストカラーと b タグの背景色を同一にする

 

弱点

bug

  • 2行以上になると崩れる
  • 定義タグ、リストタグなどでは使えない

コメントを投稿する

※メールアドレスは私にだけ届き、サイトには表示されません。
※「送信する」ボタンは、一度だけクリックしてお待ちください。