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も見ています
-
プロが教える店舗&オフィスのセキュリティ対策術
中・小規模の店舗やオフィスのセキュリティセキュリティ対策について、プロにどう対策すべきか 何を注意すべきかを教えていただきました!
-
すいません HTMLです この画像をHTML、(もしくはCSS)で表すにはどうすれば良いですか? 教
HTML・CSS
-
プログラミング言語の制作方法について
C言語・C++・C#
-
HTMLです ブロック要素にするにはどうすれば良いですか?教えてくださいお願いします
HTML・CSS
-
-
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でwebサイトを作ってるのですが、 ボタンが押された時にjsに書いている文章の 文字コードを
HTML・CSS
-
15
htmlのエラーについて(デバッグ)
PHP
-
16
HTMLですCSSです 画像のように作りたいのですが 以下のようにあってますか?間違ってる感じがしま
HTML・CSS
-
17
かっこいいウェブを作るテク
HTML・CSS
-
18
htmlのstyleのposition:relativeとpoition:abusoluteと無指定
HTML・CSS
-
19
すいませんHTMLです cssです教えてください!お願いします!↓ 画像のように イを、左上に アを
HTML・CSS
-
20
HTMLとJavaScriptで作ったタイマーアプリで時間分の設定方法がわからない
JavaScript
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
質問1.
-
タグは大文字と小文字どちらが...
-
親要素・子要素
-
タグの締め
-
アコーディオンメニューの二階...
-
【ヒトの神秘】美男美女から何...
-
超音波で洗脳。
-
角丸画像の背景色を透明にした...
-
2個のFormを横並びにしたい
-
<div align="center">を使わず...
-
inputタグはformタグで必ず囲む...
-
input type="file"の幅と高さ
-
テキストボックスの中にリンク...
-
【C++】Vector、listの要素比較...
-
画像の回り込みと、見出しの背...
-
HTMLです 四角みたいにして中に...
-
取消し線に色を付ける
-
emとstrongの反対
-
HTMLタグ間にはさまない場合に...
-
リンク付き画像を右よりに表示...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
【ヒトの神秘】美男美女から何...
-
smallにtext-allignが効かない
-
含む含まないという概念自体の...
-
還暦を過ぎた方々に質問です。
-
「諸要素」とはどういう意味で...
-
質問1.
-
textareaの幅を画面と合わせたい
-
角丸画像の背景色を透明にした...
-
2個のFormを横並びにしたい
-
テキストボックスの中にリンク...
-
HTMLです 四角みたいにして中に...
-
CSS:overflow要素の印刷について
-
input type="hidden"で取得した...
-
tdに対してmin-heightの定義、...
-
HTMLページ上でiframeを最前面...
-
タグは大文字と小文字どちらが...
-
HTMLです
-
2行にしたい要素、改行か分割...
-
改行ほどは行かないけど、若干...
-
H1タグを画像にしたい
おすすめ情報