質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
Dreamweaver

Dreamweaverは、アドビシステムズ(株)が開発したWebページ作成ソフトです。 HTMLやXHTMLだけでなく、PHPやASPなどのサイバーサイドスクリプトの編集も可能で、 OracleやMicrosoftSQLServerなどの、データベースとの連携機能もあります。 Webデザイナーなどの専門業界で圧倒的なシェアを誇っているソフトです。

Q&A

解決済

1回答

371閲覧

cssでレイアウトを綺麗に並べられない

ponchineey09083

総合スコア16

Dreamweaver

Dreamweaverは、アドビシステムズ(株)が開発したWebページ作成ソフトです。 HTMLやXHTMLだけでなく、PHPやASPなどのサイバーサイドスクリプトの編集も可能で、 OracleやMicrosoftSQLServerなどの、データベースとの連携機能もあります。 Webデザイナーなどの専門業界で圧倒的なシェアを誇っているソフトです。

0グッド

0クリップ

投稿2020/07/31 02:12

contenth3_2をcontent1h3_1の横に並べたいです。現在contenth3_2が下にあるので上にやろうとmargin-bottomで調整しようと思いましたが、上に行かず下に下がってしまいます。両方調整してもうまくいきません。
どうしたらいいのでしょうか。

参考サイト:Airbnb

<div class="content1h3_1"> <h3>なぜpoopホスト?</h3> <p>どんなお家やお部屋でも、poopなら簡単かつ安全にシェアして、世界中の旅好きな仲間とつながれます。 予約可能日から料金、ハウスルール、ゲストとの交流頻度まで、すべて自分で決めることができます。</p> </div> <div class="contenth3_2"> <h3>困ったときも安心</h3> <p>万一に備えるUS$1,000,000の財物補償、US$1,000,000の賠償責任保険が全予約に自動付帯。ホストのみなさまと建物・家財の安全をお守りするため全力で取り組んでいます。</p> </div> コード
.content1h3_1{ width:300px; height:50px; } .content1h3_1 h3{ margin-left:500px; width:300px; height:50px; font-size:25px; color:#4E4D4D; } .content1h3_1 p{ margin-left:500px; margin-top:40px; width:300px; height:50px; font-size:18px; line-height:1.5; color:#636262; } .contenth3_2{ width:300px; height:50px; } .contenth3_2 h3{ font-size:25px; width:200px; color:#4E4D4D; margin-left:900px; padding-bottom:10px; } .contenth3_2 p{ margin-left:900px; width:300px; height:50px; font-size:18px; line-height:1.5; color:#636262 } コード

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

現在のcssでは横並びになりません
親 div にdisplay:flexdisplay: grid がないと
.contenth3_2.content1h3_1 の height (50px) の下に入ります。

例を codepen で書いたので参考にしてみてください。

https://codepen.io/elzup/pen/MWKMMYR

投稿2020/07/31 02:39

編集2020/07/31 02:40
anozon

総合スコア662

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問