154787-496

2020/11/23 11:37

11回答

すみません。 ｈｔｍｌで質問です。 <div class="nav"> <ul> <a href="#"><li>MENU1</li></a> <a href="#"><li>MENU2</li></a> <a href="#"><li>MENU3</li><

すみません。 ｈｔｍｌで質問です。 <div class="nav"> <ul> <a href="#"><li>MENU1</li></a> <a href="#"><li>MENU2</li></a> <a href="#"><li>MENU3</li>< <a href="#"><li>MENU4</li></a> </ul> </div> こちらを中央寄せしたいのですができないので教えてください。 navは自分で書いて、div display block はもともとブラウザ（グーグル）書いてありました。 以下、ｃｓｓ .nav { margin: 0 auto; text-align: center; } .nav ul{ text-align:center; list-style: none; display: flex; } .nav li{ background-color:#101010; margin-right:2%; } .nav a{ font-size:3vw; color:#fff; width:20%; } user agent stylesheet div { display: block; }

HTML、CSS・11閲覧

ベストアンサー

0

ybb********

カテゴリマスター

2020/11/23 14:25

vba198830-92889さん >･････こちらを中央寄せしたい･････････ ご参考に↓ <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <style> .nav { margin: 0 auto; text-align: center; } .nav ul{ text-align:center; list-style: none; display: flex; justify-content:center; /* 追加 */ } .nav li{ background-color:#101010; margin-right:2%; } .nav a{ font-size:3vw; color:#fff; width:20%; } /* user agent stylesheet div { display: block; } */ </style> </head> <body> <div class="nav"> <ul> <a href="#"><li>MENU1</li></a> <a href="#"><li>MENU2</li></a> <a href="#"><li>MENU3</li>< <a href="#"><li>MENU4</li></a> </ul> </div> </body> </html>

ThanksImg質問者からのお礼コメント

ご回答ありがとうございます。 残念ながらできなかったので作り直しました。

お礼日時：2020/11/23 15:18