2016-12-06 9 views
0

私は固定位置のポップアップウィンドウを持っています。変換された要素のパーセンテージに基づく最大高さ

このウィンドウは、要素が追加されるにつれてサイズの増減が可能で、そのウィンドウのサイズをウィンドウの75%に制限したいと考えています。

現時点では、私が理解しているように、要素が変換されたときにフローから取り除かれ、そのために基数を基にする親要素がなくなるため、emsを使用してmax-heightを定義します。

トランスフォームを使用していても、全ウィンドウのサイズに基づいてこの要素の最大高さを作ることができる純粋なCSSの方法はありますか?

編集 - コード例を追加します。

.fade-in-container { 
 
    text-align: left; 
 
    display: table; 
 
    max-height: 55em; 
 
    width: 40em; 
 
    transition: opacity 0.2s ease-in; 
 
    position: fixed; 
 
    height: 20em; 
 
    z-index: 12; 
 
    padding: 2em; 
 
    background: #F1F1F1; 
 
    border-radius: 1%; 
 
    top: 50%; 
 
    left: 50%; 
 
    transform: translate(-50%, -50%); 
 
}
<body> 
 
    <footer></footer> 
 
    <div class='fade-in-container'></div> 
 
</body>

+0

私たちが視覚化するのに役立つ例がありますか?また、次元単位として 'vh'を使ってみましたか? – StardustGogeta

答えて

関連する問題