フレックス - 同じ高さ

Question

の側サブコンテナによって側を持つことはので、ここで問題 https://jsfiddle.net/anaegm/kn6cwfd8/

は（そのサブコンテナ、ボタンおよびコピーは、同じ自動高さを持っている必要があります2枚のタイル取っている私は何を持っているのです実際に何が起こっている

：

を私は「コピー」と「ボタンの両方を持っているにもかかわらず<div>のSEこのような何かを探して最大1）、 tを高さ100％とすると、「順番に」積み重ねるのではなく、親ラッパーに収まるように伸ばします。私は、ボタンから100％の高さを取り除いてボタンを1つ取り除くとコピーが完成し、両方とも同じ高さになると気付きましたが、私が作業しているシナリオでは、その他...基本的に、フレックスで実行可能なことをしようとしているのですか？

Answer 1

.item { 
 
    display: flex; 
 
    flex-direction: column; 
 
    border: 1px solid; 
 
    width: 300px; 
 
    height: 500px; 
 
} 
 

 
.item p { 
 
    flex: 1; 
 
} 
 

 
.item div, 
 
.item img { 
 
    flex: 0 0; 
 
}

<div class="item"> 
 
    <img src="http://placehold.it/300x180"> 
 
    <p> 
 
    Lorem Ipsum 
 
    </p> 
 
    <div class="button"> 
 
    <button>button1</button> 
 
    <button>button2</button> 
 
    <button>button3</button> 
 
    </div> 
 
</div>