CSSでテキストを上下左右に配置したバナーリンクを作成する方法について

HTML、CSS | ホームページ作成16閲覧xmlns="http://www.w3.org/2000/svg">500

その他の回答(1件)

0

slo********さん >・・・・テキストを上下左右に配置・・・・・・・・ ????? 「テキストを上下左右の中央に配置」 なら、こちらをご参考に↓ <!DOCTYPE html> <html> <head> <style> /* トピック設定 */ .topic_box { display: flex; /* 両端揃え1 */ justify-content: space-between; /* 両端揃え2 */ margin-bottom: 10px; } .topic { display: inline-block; width: 18%; height: 120px; text-align: center; /* テキストをセンター寄せ */ position: relative; } .topic a div { background: #ff0; width: 100%; height: 100%; display:flex; justify-content:center; align-items:center; /* 追加 */ } </style> </head> <body> <div class="topic_box"> <div class="topic"><a href="#"><div>テキスト<br>TEXT</div></a></div> <div class="topic"><a href="#"><div>テキスト<br>TEXT</div></a></div> <div class="topic"><a href="#"><div>テキスト<br>TEXT</div></a></div> <div class="topic"><a href="#"><div>テキスト<br>TEXT</div></a></div> <div class="topic"><a href="#"><div>テキスト<br>TEXT</div></a></div> </div> </body> </html>