スマホでテキストリンクのクリッカブルエリアを広げたい時ありますよね。
大抵これでいけます。状況によってはテキストリンク以外でも使える。
a {
display: inline-block;
padding: 10px;
margin: -10px;
position: relative;
}
See the Pen expand link area by Syuji Higa (@syuji-higa) on CodePen.
行間が狭いなど、リンク同士が近いときは重なるので調整が必要です。
padding
と margin
で相殺してるので、同じ側に反数を入れつつ調整していください。