2

より具体的には、ブラウザー ウィンドウの右側にまたがる右側のサイドバーがあります。その部分は何の問題もありませんでした。ただし、ブラウザの高さの 100% である div を含める必要がありますが、上下の余白があります。コンテンツがブラウザー ウィンドウの高さに収まらない場合、この div 内のコンテンツはスクロールします。私はそれを働かせることができません。これが私のコードです：

HTML:

<div class="outerWrap">
    <div class="innerWrap">
        // stuff
    </div>
</div>

CSS:

.outerWrap { // this works
    position: fixed;
    right: 0;
    top: 0;
    height: 100%;
    width: 277px;
}

.innerWrap { // this doesn't work
    width: 277px;
    margin: 152px 0px 10px 0px;
    overflow-y: scroll;
    overflow-x: hidden;
    height: 100%;
}

これを機能させるにはどうすればよいので、内側の div に上下のマージンを設定できますか?

4

1 に答える 1

0

使用する -

フィドル - http://jsfiddle.net/EKm7p/

html, body{height: 100%;}
.outerWrap {    
    height: 100%;
    width: 277px;
    border: 1px solid #f00;
}
.innerWrap {
    margin: 152px 0px 10px 0px;
    overflow-y: scroll;
    width: 277px;   
    display: block;
    position:absolute;
    height:auto;
    top:0;
    left:0;
    bottom:0;
    background-color: green;
}
于 2012-07-10T06:41:36.430 に答える