２段組レイアウトのCSSについて。左幅：可変/右幅：固定

質問

http://desperadoes.biz/style/dan/1-g.html

こちらのような２段組を想定しています。
（ブラウザウィンドウのサイズを変えたりして、スタイルの効き方を確認してみて下さい。）

上記ページの例ですと、左幅：固定、右幅：可変となっていますが、

私が希望するのは、その逆です。
つまり、左幅：可変、右幅：固定です。

どのようなスタイルを指定すれば良いか、どなたか教えて下さい。
---------------------------------------------
ちなみに、上記ページのスタイルは、
http://desperadoes.biz/style/dan/
で確認できます。

「TYPE C-4 左ボックスのみ幅固定。幅 : 100%」のタイプになります。
---------------------------------------------
私の考えでは、右と左を逆にすれば、目的を達成できるのかな？
なんて思い、下のように記述してみましたが、ダメでした。

#my_navigation {margin-right: 150px;}
#my_contents {float : right ; width : 150px ;}

回答No.2

salonpath · ベストアンサー

あれ、htmlも変わるんですか？
汲み取れずすみません。

その場合は、ネガティブマージンを使うといいみたいですよ。

■css/#my_contentsと#my_navigationは入れ替わっているとして
#my_contents {
width:100%;
float:left;
margin-right:-150px;
display:inline;
}
#mymain {
margin-right:150px;
}
#my_navigation {
float:left;
width:150px;
}

お礼

さらなる回答をどうもありがとうございます。

ネガティブマージンを利用する考え方で、目的のデザインを達成することができました。
また分からないことがありましたら、色々と教えて下さい。（＾＾

回答No.1

salonpath

右と左を逆にするだけですよ

#my_navigation { float : right ; width : 150px ; }
#my_contents {margin-right: 150px;}

お礼

回答をどうもありがとうございます。

HTMLソースにおいて、

<div id='my_navigation'>略</div>

<div id='my_contents'>略</div>

という順序ではなく、

<div id='my_contents'>略</div>

<div id='my_navigation'>略</div>

という順序で、

ナビゲーション（メニュー列）を右側に配置し、
尚かつ、固定幅にすることは可能でしょうか？
知りたいことは、まさに、コレなんです。
※なお、左側に配すコンテンツ列は可変にします。

---------------------
ちなみに、HTMLソースにおいて、
ナビゲーション（メニュー列）の<div>が先に登場する場合には、
おっしゃる通り、うまくスタイルが機能し、目的通りの配置となりました。