Q&A
前提・実現したいこと
画像のような配置にしたい
発生している問題・エラーメッセージ
１２３
４５６
と
display:flex;
flex-wrap:wrap;
で横並びで折り返すことは出来たが、
ｈ２とulは縦並びにすることが出来ない
該当のソースコード
html
1<!doctype html> 2<html lang="ja"> 3 4<head> 5 <meta charset="utf-8"> 6 <link rel="stylesheet" href="css/style.css"> 7</head> 8<main> 9<section id=aaa> 10<div><h2>1</h2> 11<ul><li></li><li></li></ul> 12</div> 13<div><h2>2</h2> 14<ul><li></li><li></li></ul> 15</div> 16<div><h2>3</h2> 17<ul><li></li><li></li></ul> 18</div> 19<div><h2>4</h2> 20<ul><li></li><li></li></ul> 21</div> 22</section> 23</main>
css
1#aaa{display:flex; 2flex-wrap:wrap; 3justify-content:space-around;}
回答1件
0
自己解決
css
1#aaa div{ 2 display: flex; 3 flex-direction: column;}
でいけました
投稿2021/03/18 14:25
総合スコア11
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。