質問: サイトのページの一番上に 単語間が均等離れているメニューバ-を作りたいのですが aタグとtext-alignの併用ができないため代わりとなる方法が知りたいです。 html Mac iPad iPhone Watch TV Music サポート css .header-list p a { float:left; color:white; text-align:center; } Appleの公式サイト 「https://www.apple.com/jp/?afid=p238%7ChAvYO2nc-dc_mtid_18707vxu38484&cid=aos-jp-kwyh-brand-slid--」 を真似てサイト作りの練習をしています。 ネットで調べた情報「http://www.htmq.com/htmlkihon/005.shtml」では、 ブロック要素の中にインライン要素を置くことができるとあったので試したのですが状況は変わりませんでした。
回答: `display: flex;`と`justify-content: space-between;`でこんな感じにすればいいのかな。 ああ、提示のHTMLのpをすべてliにしていることが前提です。 ``` .header-list ul { display: flex; justify-content: space-between; padding-left: 0; margin: 0 auto; max-width: 980px; } .header-list li { list-style: none; text-align: center; padding: 0.5em 2em; border: green solid 1px; /* 確認用 */ } ```