子どもの身長に設定された最大高さ

Question

私はラッパーdivと非常に背の高い子を持っています。ラッパーにはresize: vertical;がありますので、拡張することができます。

子の高さがラッパーより大きい場合を除き、resize: verticalが機能します。だから、私は余分なスペースを追加ラッパーを拡張することを禁止する必要があります。

この問題の純粋なCSSソリューションはありますか？それはコースの制限ではありません。

私はこれがラッパーのmax-heightプロパティによって実現されると思います。しかし、私がそこに書き込む価値は何ですか？

以下の例では、制限なしでラッパーを拡張できます。

html, body { 
 
    padding: 0;margin:0;border:0; 
 
    height: 1000px; 
 
    background: rgba(0,0,0,0.05); 
 
} 
 

 
.wrapper { 
 
    background: red; 
 
    width: 400px; 
 
    height: 200px; 
 
    max-height: 100%; /* What should be here? */ 
 
    resize: vertical; 
 
    overflow: auto; 
 
}

<div class="wrapper"> 
 
    <div class="child"> 
 
    <p>Garpike. Roosterfish bigmouth buffalo sand lance redside lyretail scissor-tail rasbora riffle dace. Mosquitofish golden dojo chub: pineconefish; squawfish hillstream loach, neon tetra tommy ruff clownfish, zebra lionfish snipe eel. Hamlet, "smalleye squaretail perch wolf-eel, snailfish velvet-belly shark Black tetra cherry salmon collared dogfish." Upside-down catfish sweeper wels catfish driftwood catfish nurse shark Arctic char yellowhead jawfish crucian carp, mojarra Sacramento splittail thornyhead antenna codlet banded killifish. Bamboo shark porcupinefish threadfin bream, largemouth bass. Channel bass slender mola plownose chimaera, catalufa paradise fish African glass catfish weasel shark clingfish wolf-eel scissor-tail rasbora Blobfish? Barb, tonguefish featherfin knifefish.</p> 
 
    </div> 
 
</div>

Answer 1

何あなたの要素max-height: inherit;で、その後、親要素にmax-heightを設定し、約 - 動作するはずです。