0

HTML コード:

<div class="container">
    <div class="menu">
        <div class="target">
        </div>
    </div>
    <div class="main"></div>
</div>

CSS コード:

.container{
    position : absolute;
    height : 100%;
    width : 100%;
    background-color : green;
}

.menu{
    position : absolute;
    top:0;
    left :0;
    height: 100%;
    width : 30%;
    background-color : orange;
}

.main{
    position : absolute;
    top:0;
    left : 30%;
    height : 100%;
    width : 70%;
    background-color : blue;
}

.target{
    position : relative;
    top : 20px;
    left : 10%;
    height: 70%;
    bottom : 100px;
    width : 80%;
    background-color : pink;
    overflow-y : auto;
}

質問：

' ' divheightの ' ' プロパティを削除したいので、div の ' ' は ' ' および ' ' プロパティのみに依存します。.targetheighttopbottom

私の目的は、オプションで「 」を指定せずに、.menu「 」の下部と「 」の下部の間の距離を固定することです。.targetheight

完全なコードはhttp://jsfiddle.net/dGkFq/3/にあります。

どうもありがとう。

4

2 に答える 2

1

まあ、あなたが使用すればできますposition:absolute：http://jsfiddle.net/dGkFq/4/

.target{
    position : absolute;
    top : 20px;
    left : 10%;
    bottom : 100px;
    width : 80%;
    background-color : pink;
    display:block;
    overflow-y : auto;
}
于 2013-08-19T17:33:36.590 に答える
0

http://jsfiddle.net/dGkFq/5/

ユースケース 1:

ここに画像の説明を入力

ユースケース 2:

ここに画像の説明を入力

.target{
    position : absolute;
    top : 20px;
    left : 10%;
    bottom : 100px;
    width : 80%;
    background-color : pink;
    overflow-y : auto;
}
于 2013-08-19T17:34:18.860 に答える