divブロックの移動を停止する

Question

divブロックの位置を制御できません。ここにhtmlコードがあります。

<div id="d1"> 
    <div id="d2"> 
     <div id="d3" style="float:left" > 
      <img src="image.jpg" > 
     </div> 

     <div id="d4"> 
      Lorem Ipsum .... Dummy Text 
     </div> 
    </div> 
    <div id="d5"> 
     Stop this text from moving up 
    </div> 
</div> 

私はD3およびD4は、2列並列になりたい、とD5は、ソートのほとんどのウェブサイトではフッターのように、これらの両方の下に来る必要があります。したがって、float：leftスタイルをdiv d3に追加すると、d5テキストが「Lorem Ipsum」テキストのすぐ下に移動します。どうすれば2列を動作させ、d5の位置を固定することができますか？かなり基本的ですが、私は何が欠けているのか分かりません。

Answer 1

クリアを追加してみてください。 id 'd5'のdivに

あなたのCSSでは、たとえば、このCSS属性に関する

div#d5 
{ 
    clear:both; 
} 

より多くの情報が

Answer 2

だけhere見つけることができる「フロート：左」トリックを行いません。 ＃d3に幅や何かを追加し、＃d4を（幅とともに）浮かせる必要があります。

＃d5は、 'clear：both;'のようなスタイルを必要とします。 ＃d3 &＃d4列の下に配置します。ブラウザの画面の下部に固定したい場合は、 'position：fixed;下：0; ' また、＃d2 divは必須ではありません。