0

コンテナーを自分の身長の 100% にしようとしていますが、その高さの 10% と 90% のヘッダーとテキストエリア ブロックが必要です。

ここに私の結果と私のコードのフィドルがあります: JSFiddle

パディングのためにヘッダーのみが表示されることに注意してください。

また、私のクロムエクスプローラーコンテナでは、上記のフィドルのように本体の高さが 100% になりません。

HTML:

<div id="container">
    <div id="header"></div>
    <textarea autofocus id="textarea"></textarea>
</div>

CSS:

html, body {
    height: 100%;
}
#container {
    min-width: 240px;
    min-height: 100%;
}
#header {
    height: 10%;
    background: blue;
    width: 100%;
    padding: 22px 0 0 0;
    margin: 0 auto;
}
#textarea {
    background: yellow;
    line-height: 1.5em;
    width: 100%;
    height: 90%;
}
4

2 に答える 2

-1

div はブロック要素であり、コンテンツの高さのみを取ります。したがって、大きすぎる場合は、高さの値を % ではなく px で指定する必要があります。だからあなたの場合は試してください

html, body {
height: 500px;

}

と

height: 800px;
于 2013-11-08T10:16:12.073 に答える