//AdSenseにリンク

flex boxの基本の使い方

flex boxで横並びにするには

flex boxには、コンテナとアイテムが必要。

コンテナとは大枠(ulなど)アイテムは中身(liなど)

※コンテナ要素がない場合はdivで作る

使い方の例

クラスをそれぞれつける
      <ul class="books">
        <li class="book">横並び左</li>
        <li class="book">横並び中</li>
        <li class="book">横並び右</li>
      </ul>
コンテナにdisplay: flexを使う
.books {
  display: flex;
}

その他を整えていく。

.books {
  display: flex;
  list-style: none;
}
.book {
  background-color: lightgray;
  padding: 10px;
  margin-right:10px;
}

html,css