3

2 つの例から始めます。

13 インチ macbook pro: マックスクリーン 21 インチ フィリップス モニター フィリップスクリーン

で親要素の全幅を設定することは可能ですposition:fixedが、子要素の場合はブラウザ サイトまで幅を設定するため、すべてのサイズのテキストはブラウザ サイトまでまたは最大幅になります。

CSS:

div#wrapper{
    width: 100%;
    height: 100%;
    padding-top: 70px;
}

header#left-panel, header#right-panel{
    background: none repeat scroll 0 0 #000000;
    min-height: 40px;
    padding: 10px;
    opacity: 0.8;
}

header#left-panel{
    width: 185px;
    position: fixed;
}

header#right-panel{
    /*width: 100%;*/ /*here is the problem*/
    left: 755px;
    position: fixed;
}

HTML:

<body>
    <div id="wrapper">
        <header id="left-panel">
            <section id="contacts">
            </section>
        </header>
        <header id="right-panel">
            <section id="comments">
                <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
                <div style="float:right">Lorem ipsum</div>
            </section>
        </header>
    </div>
</body>
4

2 に答える 2

1

要素で使用right:0しheader#right-panelます。

この jsFiddleでそれをいじることができます。

于 2013-02-16T19:58:40.640 に答える
0 
header#right-panel{
    /*width: 100%;*/ 
    right: -1px;
    position: fixed;
}

動作するはずです

于 2013-02-16T20:00:40.747 に答える