Absoloute位置分隔到相對父母的底部

Question

我試圖將'藍色'放在父容器的底部'綠色'。我試過以下this answer，但無法使它工作。我想要藍色的div在綠色div的底部。

#green { 
 
\t position:relative; 
 
\t width:auto; 
 
\t height:200px; 
 
\t background-color:green; 
 
} 
 

 

 

 
#blue { 
 
\t position:absoloute; 
 
\t bottom:0; 
 
\t height:75px; 
 
\t width:auto; 
 
\t background-color:blue; 
 
}

<div id="green"> 
 
\t <div id="blue"></div> 
 
</div>

感謝。

Answer 1

1-您需要將位置absoloute更改爲#blue的絕對值，然後將寬度自動調整爲寬度100％。

#blue { 
    position: absolute; 
    bottom: 0; 
    height: 75px; 
    width: 100%; 
    background-color: blue; 
} 

這裏是你http://codepen.io/saorabhkr/pen/BoQjvN