BinaryDevelop
  1. ホーム
  2. ハイパーリンク

[解決済み】divを横に並べて配置する方法

2022-03-31 08:32:47

質問

私は幅100%に設定されたメインのラッパーdivを持っています。その中に2つのdivを置きたいのですが、1つは固定幅で、もう1つは残りのスペースを埋めるものです。どのようにすれば、2番目のdivをフロートさせ、残りのスペースを埋めることができるのでしょうか？よろしくお願いします。

解決方法を教えてください。

ご質問のようなことを行うには、いろいろな方法があります。

  1. 使用方法 CSS float プロパティ : 

 <div style="width: 100%; overflow: hidden;">
     <div style="width: 600px; float: left;"> Left </div>
     <div style="margin-left: 620px;"> Right </div>
</div>

  1. 使用方法 CSS display プロパティ - とすることができます。 div のように動作します。 table : 

<div style="width: 100%; display: table;">
    <div style="display: table-row">
        <div style="width: 600px; display: table-cell;"> Left </div>
        <div style="display: table-cell;"> Right </div>
    </div>
</div>

他にも方法はありますが、この2つが代表的なものです。

関連

最新

おすすめ

について
/
プライバシー・ポリシー
/
お問い合わせ
© 2022 BinaryDevelop. すべての権利は、それぞれの所有者に帰属します