アイコンなどには {padding: 5px; margin: -5px} のようにパディング追加してネガティブマージンで相殺する方法もある。レイアウトに影響を与えないし、お手軽やぞ。

Knoa のブックマーク 2019/12/04 09:11

<blockquote class="hatena-bookmark-comment"><a class="comment-info" href="https://b.hatena.ne.jp/entry/4675838546331106594/comment/Knoa" data-user-id="Knoa" data-entry-url="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/css/enhancing-the-clickable-area-size.html" data-original-href="https://coliss.com/articles/build-websites/operation/css/enhancing-the-clickable-area-size.html" data-entry-favicon="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fcoliss.com%2Farticles%2Fbuild-websites%2Foperation%2Fcss%2Fenhancing-the-clickable-area-size.html" data-user-icon="/users/Knoa/profile.png">ボタンやアイコンやナビゲーションなど、クリック・タップ可能な領域のサイズを広くする実装方法のまとめ</a><br><p style="clear: left">アイコンなどには {padding: 5px; margin: -5px} のようにパディング追加してネガティブマージンで相殺する方法もある。レイアウトに影響を与えないし、お手軽やぞ。</p><a class="datetime" href="https://b.hatena.ne.jp/Knoa/20191204#bookmark-4675838546331106594"><span class="datetime-body">2019/12/04 09:11</span></a></blockquote><script src="https://b.st-hatena.com/js/comment-widget.js" charset="utf-8" async></script>

このブックマークにはスターがありません。
最初のスターをつけてみよう！

ボタンやアイコンやナビゲーションなど、クリック・タップ可能な領域のサイズを広くする実装方法のまとめ

coliss.com2019/10/15

ボタンやアイコン、ナビゲーション、サイドバーなど、さまざまなUI要素に適したクリック・タップ可能な領域のサイズを拡張する実装方法を紹介します。 Enhancing The Clickable Area Size by Ahmad Shadeed 下記...

25 人がブックマーク・2 件のコメント

他のコメントを読む

＼コメントがサクサク読めるアプリです／

はてなブックマーク

ボタンやアイコンやナビゲーションなど、クリック・タップ可能な領域のサイズを広くする実装方法のまとめ

はてなブックマーク

公式Twitter

はてなのサービス