<div align="center"><div align="left">説明文</div><div align="right">図</div></div>

Question

お世話になっております。

タイトルのようにして

説明文　　　「
をズラズラ　　　　図
と表記　　　　　　　　　」

としたいと思っているのですが
実際は

説明文
をズラズラ
と表記
　　　　　　　「
　　　　　　　　　　図
　　　　　　　　　　　　　」

となってしまいます……

<div align="center">
　<div align="left">説明文</div>
　<div align="right">図</div>
</div>

ではなくてどのようにするのがhtmlでは一般的なのでしょうか？
さすがにtable使うのは違うと思います……

初心者の質問失礼しますが上記お問い合わせいたします。

Answer 1

align属性はとっくになくなってしまったので、忘れてしまってもいいです。
見た目の変更はスタイルシートで行います。

   <div class="figure">
    <div class="figcaption">説明文をズラズラと表記</div>
    <div class="img">図</div>
   </div>

.figure {
  display: flex;
}

floatを使う手もありますが割愛。

Comments

[moitaro]

コメントありがとうございます。
align属性は過去のものなのですね……

floatになったのでしょうか？

figcaption
img
のcssを表記すれば出来そうですねっ

ありがとうございました。

[x_x]

あ、floatもスタイルシートの話です。
https://developer.mozilla.org/ja/docs/Web/CSS/float
https://developer.mozilla.org/ja/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes

[moitaro]

ありがとうございます。
cssで
.right{
float: right;
}

.left{
float: left;
}
としてhtmlを
<div style="width: 500px;" class="left";>
説明文
</div>
<div class="right">
図
</div>
として実装しました。
ありがとうございました。

まさかalignが過去のものになっているとは……