No.2ベストアンサー
- 回答日時:
こんばんは
雰囲気だけの、いい加減なな一例ですけれど・・・
<!DOCTYPE HTML>
<html lang="ja">
<head><title>Sample</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
#wrap {
width: 80vw;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
}
#wrap > div {
width: 35vw; height: 35vw;
margin: 2vw;
border: 1px solid gray;
text-align: center;
font-size: 4vw;
}
</style>
</head>
<body>
<div id="wrap">
<div>ホ</div>
<div>ア</div>
<div>レ</div>
</div>
</body>
</html>
No.1
- 回答日時:
先ず1番上の段の2つの要素をブロック要素にして、その2つの要素を別の新たなブロック要素の子要素にする。
そしてCSSで親要素にdisplay: flex;を指定する。
あとはjustify-content(これも親要素に指定する)で子要素の位置を調整する。
残りの1番下の段は普通にブロック要素にすれば良いんじゃないかな。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- 囲碁・将棋 角換わりで先手の速攻が決まったというが(左美濃) 2 2021/12/22 18:47
- Visual Basic(VBA) このプログラムがわかりません 2 2021/12/21 16:40
- Illustrator(イラストレーター) イラストレーターで添付画像のような五角形を簡単に作る方法を教えてください 3 2022/10/30 15:14
- 囲碁・将棋 ウオーズで負けました 1 2022/08/06 06:13
- 数学 38(2)の三角形の形状なんですけどargα-r/β-r=-1/2πがいきなりなぜ+1/2πに変わっ 1 2022/02/03 02:55
- 数学 次の図の正八角形に含まれる三角形ABCの面積が1であるとき、三角形CDEの面積はいくらか。 答え2+ 3 2022/02/03 10:56
- Illustrator(イラストレーター) イラストレーターで、一本の線を斜めにして、上下を四角で囲った時に四角の線と重なるようにカットする方法 1 2022/11/05 20:24
- 囲碁・将棋 2019年1月号ゴキ中を押さえ込もう 2 2022/08/25 08:01
- 囲碁・将棋 詰めろが分かりません(第71回NHK杯3回戦) 2 2023/01/07 10:48
- 囲碁・将棋 角換わりの序盤(早繰り銀) 1 2022/08/21 11:50
このQ&Aを見た人はこんなQ&Aも見ています
-
新NISA制度は今までと何が変わる?非課税枠の拡大や投資対象の変更などを解説!
少額から投資を行う人のための非課税制度であるNISAが、2024年に改正される。おすすめの銘柄や投資額の目安について教えてもらった。
-
HTMLです ブロック要素にするにはどうすれば良いですか?教えてくださいお願いします
HTML・CSS
-
すいません HTMLです この画像をHTML、(もしくはCSS)で表すにはどうすれば良いですか? 教
HTML・CSS
-
プログラミング言語の制作方法について
C言語・C++・C#
-
-
4
CSSで謎の現象
HTML・CSS
-
5
大至急。webのシングルページを作ろうと考え、イラレでデザインをしました。 それからの手順で悩んでる
HTML・CSS
-
6
HTMLとJavaScriptで作ったタイマーアプリが正常に動作しない
JavaScript
-
7
HTMLです 店主のこだわりというのを画像のように表せますか? 背景は茶色で 文字は白で 点線と白四
HTML・CSS
-
8
HTMLの CSSのファイルというのは、 .cssにするとメモ帳が出てくるのですが 大丈夫でしょうか
HTML・CSS
-
9
複雑なシフト表から1日ごとの出勤者、シフトを抜き出したいです
Excel(エクセル)
-
10
ワードプレスで事前定義されたclassの一覧を見たいです
HTML・CSS
-
11
HTMLのbody内に<style>~</style>定義は作法的にOKでしょうか?
HTML・CSS
-
12
htmlの修正方法を教えていただきたいです。
HTML・CSS
-
13
[初心者]javascriptのfor文でなぜか繰り返し処理をしない。理由がわかりません。
JavaScript
-
14
htmlのエラーについて(デバッグ)
PHP
-
15
HTMLでwebサイトを作ってるのですが、 ボタンが押された時にjsに書いている文章の 文字コードを
HTML・CSS
-
16
HTMLでstyleを指定するフォームの作り方
HTML・CSS
-
17
HTMLとJavaScriptで作ったタイマーアプリで時間分の設定方法がわからない
JavaScript
-
18
htmlのstyleのposition:relativeとpoition:abusoluteと無指定
HTML・CSS
-
19
かっこいいウェブを作るテク
HTML・CSS
-
20
ウェブ、孤立画像を検出する方法
その他(プログラミング・Web制作)
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
【ヒトの神秘】美男美女から何...
-
質問1.
-
submit buttonの違い
-
input type="hidden"で取得した...
-
smallにtext-allignが効かない
-
<textarea>に<pre>を使うと・・・
-
配列の要素をまとめて比較したい
-
取消し線に色を付ける
-
textareaの幅を画面と合わせたい
-
HTMLページ上でiframeを最前面...
-
CSS:overflow要素の印刷について
-
超音波で洗脳。
-
角丸画像の背景色を透明にした...
-
<br /><hr />どっちを使ったら...
-
下線と文字の間を調整するには...
-
【CSS】imgタグを、親要素の幅...
-
VBA でIE 操作 ボタンをクリッ...
-
「にはとって代わることのでき...
-
1から100までの自然数のうち、2...
-
HTMLで <p>~</p>内で2回以...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
【ヒトの神秘】美男美女から何...
-
超音波で洗脳。
-
質問1.
-
smallにtext-allignが効かない
-
含む含まないという概念自体の...
-
NからZへの全単射を具体的に構...
-
角丸画像の背景色を透明にした...
-
タグは大文字と小文字どちらが...
-
改行ほどは行かないけど、若干...
-
2個のFormを横並びにしたい
-
「諸要素」とはどういう意味で...
-
input type="hidden"で取得した...
-
CSS:overflow要素の印刷について
-
textareaの幅を画面と合わせたい
-
親要素・子要素
-
テキストボックスの中にリンク...
-
emとstrongの反対
-
cssのdisplay:block
-
border: noneでボタンの境界線...
-
tdに対してmin-heightの定義、...
おすすめ情報