html
1<div> 2 <%= link_to root_path do %> 3 <%= image_tag 'teratail.jpg', :class => 'image' %> 4 <% end %> 5</div>
css
1div{ 2 width: 100px; 3 height: 100px; 4} 5.image{ 6 width: 100%; 7 height: 100%; 8 object-fit: scale-down; 9}
上記のように書くと、divと画像の間にできる余白部分にまでリンクがかかってしまいます。
画像にのみリンクを効かせるには、どこをどう修正すればよいでしょうか。
※上記コードはサンプルです。実際には縦長のdivに画像を埋め込んだりもします。その場合、横長の画像には画像上下に余白が多くなるため、画像にのみリンクを貼りたいです。
※複数画像をループで埋め込むつもりなので、cssのbackground-imageは使いません。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/09/20 12:28