電子書籍の厳選無料作品が豊富!

position:fixed;でメニューを右側に固定したい

こちらを参考にサイドバーが固定された2カラムのサイトを作っています。
http://www.css-lecture.com/log/css/049.html
上記のサイトを見てくだされば分かると思うのですが、サイトバーはすべてを囲うwrapperボックスの左端に固定されています。
これをwrapperボックスの右端に持って行きたいのですが、うまくいきません。
position:fixed;にrightやleftを指定すると、wrapperボックスではなくブラウザの端に寄ってしまいます。
absolutoではスクロールされてしまいますし……。
自分なりに調べていろいろと試してみたのですが、解決することはできませんでした。
javascriptや疑似フレームは出来るだけ使いたくありません。
右端に持って行くことは可能なのでしょうか?現状では無理なのでしょうか?

HTML
<div id="wrapper">
<div id="menu"></div>
<div id="main"></div>
</div>

CSS
#wrapper{
width:700px;
margin:0 auto;
background-color:#FFF;
position:relative;
}
div#menu{
width: 100px;
background: #CCC;
padding:10px;
height:100%;
position:fixed;
top: 0px;
z-index: 20;
}
* html div#subContents {
position: absolute;
top: expression(eval(document.documentElement.scrollTop+0));
}
#main{
margin-left:120px;
padding:10px;
width:560px;
position:relative;
background-color:#FFF;
}

よろしくお願いします。

A 回答 (1件)

左のマージンを取ってみるとか…?

    • good
    • 0
この回答へのお礼

……#menuにmargin-left:600pxを追加したら、できました!
fixedやabsolutoを使う方法ばかりあれこれと調べていて、その発想はすっかり頭からぬけていました。
こんな簡単にできたんですね。諦めかけていたので、本当に質問して良かったです。
ありがとうございました!

お礼日時:2010/05/05 16:40

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!