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的にどうなんだろう？