アプリ版：「スタンプのみでお礼する」機能のリリースについて

HTMLです 四角みたいにして中には ホ、 ア、 レ みたいに 上の四角は2つ、 下は左に1つ、 と

解決済

  • 質問者：Wohinfahrensie
  • 質問日時：
  • 回答数：2件

HTMLです

四角みたいにして中には
ホ、
ア、
レ
みたいに
上の四角は2つ、
下は左に1つ、
というように
できますか？
お願いします！教えてください！すいません！

「HTMLです 四角みたいにして中には ホ」の質問画像
通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (2件)

参考程度に

No.2ベストアンサー

  • 回答者： fujillin
  • 回答日時：

こんばんは



雰囲気だけの、いい加減なな一例ですけれど・・・

<!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>
    • good
    • 1
    • 件
通報する

No.1

  • 回答者： Ton3901
  • 回答日時：

先ず1番上の段の2つの要素をブロック要素にして、その2つの要素を別の新たなブロック要素の子要素にする。


そしてCSSで親要素にdisplay: flex;を指定する。
あとはjustify-content(これも親要素に指定する)で子要素の位置を調整する。
残りの1番下の段は普通にブロック要素にすれば良いんじゃないかな。
    • good
    • 0
    • 件
通報する

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

このQ&Aを見た人はこんなQ&Aも見ています

関連するカテゴリからQ&Aを探す

ページトップページトップ

Q質問する（無料）

このQ&Aを見た人がよく見るQ&A

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報