innere DIV gesperrt von äußeren DIV rechten Ecke zu senken

Question

mit dem folgenden HTML

<div style="width: 500px; height: 500px; border: 1px solid red;"> 
    <div style="width: 200px; height: 100px; border: 1px solid green; float: right; vertical-align: bottom;"> 
    </div> 
</div> 

ich das innere div in der unteren rechten Ecke des äußeren div sperren möchte. Was muss ich tun, um dies zu erreichen?

Danke! John

Answer 1

position ist dein Freund

<div style="width: 500px; height: 500px; border: 1px solid red; position: relative"> 
    <div style="position: absolute; right: 0; bottom: 0; width: 200px; height: 100px; border: 1px solid green;"> 
    </div> 
</div> 

Answer 2

<div style="position:relative; width: 500px; height: 500px; border: 1px solid red;"> 
    <div style="position:absolute;right:0px;bottom:0px;width: 200px; height: 100px; border: 1px solid green;"> 
    </div> 
</div> 

dass versuchen. Kurze Version: position: relativ zum äußeren div, position: absolute zum inneren div und sagen, dass das innere div 0 Pixel von der rechten und unteren Kante des übergeordneten Containers sein soll.