divを他のdivの下端に貼り付けます（ウィンドウの下端ではありません）

Question

divだからdivが常に別のdivの下にくるようにします。 私はbottom：0、position：absoluteを使用しました。これは、ウィンドウがメインのdivと同じサイズ（ウィンドウのサイズも同じです）である限り動作しますが、メインdivには最小の高さが設定されています。ウィンドウが小さくなるとdivの開始が上がります窓の底に vertical-alignもメインdivの他のdivの下に貼り付けるので、この目的のためには機能しませんが、それは私の目標であるメインdivの下にはありません。

どうすればこの問題を解決できますか？

Answer 1

あなたはそのためのフレキシボックスを使用することができます。私の理解から

.parent { 
 
    width: 50%; 
 
    height: 200px; 
 
    border: 1px solid grey; 
 
    margin: 1em auto; 
 
    display: flex; 
 
    flex-direction: column; 
 
    align-items: center; 
 
} 
 
.child { 
 
    width: 60%; 
 
    height: 50px; 
 
    background: rebeccapurple; 
 
    margin-top: auto; 
 
}

<div class="parent"> 
 
    <div class="child"></div> 
 
</div>

Answer 2

は、あなたがdiv要素は、常にどんな、DIVの下部に固定されていないことを確認します。その場合、親divがposition：relativeを持っていることを確認するだけです。ただし、子はposition：absoluteを持ち、絶対的にdivの下部に配置されています。

親divに最小高さがある場合でも、画面サイズはこれに影響しません。

私がオフになっている場合は、コードを投稿すれば、より効果的に役立つかもしれません。

HTML

<div class="parent"> 
    <div class="child"></div> 
</div> 

CSS：

<style> 
.parent { 
    position: relative; 
    min-height:--px 
} 
.child { 
    position: absolute; 
    bottom: 0; 
}