HTMLのアンカーポイントの位置を上にずらしてみた

ページ内リンクなどで使われるアンカーポイントですが、特に指定をしないとウィンドウの上端に移動します。

ただ、ウィンドウの上端だと少し読みづらかったり、見つけづらかったりするので、少し余白を空けたいことがあります。

アンカーポイントの下に余白を空ける方法もあると思いますが、コーディングを済ませた後にアンカーポイントだけ挿入したい時に少し手間になってしまいます。

そこで、以下のようなCSSを適用させてみました。

.hideAnchor {
    display:block;
    height:0px;
    /height:1px;
    overflow:hidden;
    text-indent:-9999px;
    margin-top:-10px;
    padding-bottom:10px;
}

上の記述でデザインはそのままに、通常挿入する位置の10px上の位置にアンカーポイントを挿入することが出来ます。

height:0;overflow:hidden;text-indent:-9999px;でテキストを隠しているのでSEO的にどうなんだろう?