相対位置と絶対位置の理解：内部divをコンテナの一番下に配置する方法

Question

divとcssでレイアウトする方法をまだ学習しています。

<div id="Fascione"> 
</div> 
<div id="Wrapper"> 
    <div id="Menu"> 
    </div> 
    <div id="Contenuto"> 
     <div id="Liturgia"> 
     </div> 
     <div id="Container"> 
      <div id="Ristorante"> 
      </div> 
      <div id="Insieme"> 
      </div> 
      <div id="Progetto"> 
      </div> 
     </div> 
     <div id="Unitre"> 
     </div> 
    </div> 
</div> 
<div id="Footer"> 
</div> 

とCSSのようになります：私がやりたいことは、「PROGETTO」divの下の境界は「Unitre」上の境界と一緒に固執することです

html, body{width:100%;height:100%;} 
body{width:1024px; margin:0px auto;padding:0px;border-width:0px;} 
div#Fascione{width:inherit;height:125px;border-bottom:2px solid black;} 
div#Wrapper{width:inherit;padding:8px 0px 8px 0px;/*background-color:#647;*/} 
    div#Menu{float:left;width:200px;/*background-color:#F41;*/} 
    div#Contenuto{margin-left:208px;/*background-color:#9bb;*/} 
     div#Liturgia{float:left;width:34%;margin-bottom:1%;background-color:#987;} 
     div#Container{float:left;width:65%;margin-bottom:1%;margin-left:1%;background-color:#aaaaaa;} 
      div#Ristorante{float:left;width:49%;margin-bottom:1%;margin-left:1%;background-color:#123;} 
      div#Insieme{float:left;width:49%;margin-bottom:1%;margin-left:1%;background-color:#abc;} 
      div#Progetto{float:left;border-top:1px solid gray;background-color:#369;} 
    div#Unitre{clear:left;border-top:1px solid gray;background-color:#de7;} 
div#Footer{clear:left;width:inherit;height:40px;border-top:2px solid black;/*background-color:#1a9;*/} /* clear left needed! */ 

私は、次のHTMLを持っています。

他の記事を読む私はposition：relativeと "Progetto" position：absolute; bottom：0px;と "Container"を設定しようとしました。しかし、これは私が必要とすることをしません。

誰でも手伝ってもらえますか？

Answer 1

の相対位置でコンテナを設定すると、あなたがしようとする必要があります良いpractice.Whatが2つのdiv beetween余白うちゼロであり、唯一例えば必要両側に境界線を追加されていません。

Proggetto{ 
//no bottom border; 
border:1px 1px 0 1px; 
border-color:black; 
margin:0; 
} 
Unitre{ 
border:1px solid black 
margin:0; 
}