ヘッダーのタイトルとメニューを横並びにしたいです。
しかし、cssのul にdisplay flexを入れてみましたが、反応ありませんでした。
初歩的なところで申し訳ありませんが、教えていただけますと幸いです。
【html】
<body> <header>> <div> <h1>○○○ <br> <small class="subheading">○○○</small> </h1> <nav> <ul> <li><a href="#contA">○○○</a></li> <li><a href="#contB">○○○</a></li> <li><a href="#contC">○○○</a></li> <li><a href="#contD">○○○</a></li> <li><a href="#contE">○○○</a></li> </ul> </nav> </header> </body>【css】
header {
background-color: #BAE3F9;
color: black;
display: flex;
width: 100%;
margin: auto;
padding: auto;
}
header a {
font-weight: bold;
}
body {
width: 100%;
margin: 0 auto;
padding: auto;
background-color :white;
display: block;
}
ul {
overflow: hidden;
list-style:none;
margin: 0 auto;
z-index: 20;
text-align: center;
font-size:17px;
display: flex;
padding-left: 8em;
padding-right: 8em;
}
ul li {
margin: auto;
text-align:center;
flex-grow: 1.5;
}
回答3件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2022/01/21 08:54