障害メモ/ChromeとSafariでページ内リンクできない

キーワード

  • HTML/CSS
  • after(疑似要素)

現象

Google ChromeとSafariでページ内リンクできない。

  • HTML
<div id="header"></div>

<a href="#header"><span></span></a>
  • CSS
a[href="#header"] > span:after {
  content: "このページのトップへ"
}

見栄えはアンカーだがリンクになってない。

原因

どうも疑似要素ではリンクできないくさい。

対策

JavaScriptで差し替えた。

jQuery('a[href="#header"] > span').after("このページのトップへ").remove();

参考

作成日 2013-08-17