[css] css-div를 포함하는 div의 맨 아래에 위치

컨테이너 div의 맨 아래에 div를 배치하려면 어떻게해야합니까?

<style>
.outside {
    width: 200px;
    height: 200px;
    background-color: #EEE; /*to make it visible*/
}
.inside {
    position: absolute;
    bottom: 2px;
}
</style>
<div class="outside">
    <div class="inside">inside</div>
</div>

이 코드는 페이지 하단에 “내부”라는 텍스트를 넣습니다.

답변

.outside {
    width: 200px;
    height: 200px;
    background-color: #EEE; /*to make it visible*/
}

.outside {
    position: relative;
    width: 200px;
    height: 200px;
    background-color: #EEE; /*to make it visible*/
}

.outside {
    position:relative;
}
.inside {
    position: absolute;
    bottom: 0;
}