サイドメニューの固定位置

###サイドメニューの位置を表示幅で変えたくない
PC画面用にサイトを作成しようと思っています。
大まかなデザインは中央にメインコンテンツがあって、その右に
サイドメニューがある形です。

この右のメニューの位置をcssのpositionで設定したのですが
右からいくつ、トップからいくつと指定しているので、画面の幅によって
メインコンテンツに被ってしまったり、右にいきすぎたりしてしまいます。

表示幅の右からいくつ…という設定でなくて、メインコンテンツからどのくらい
離れてるか、という設定にして固定したいと思います。
そのようなことは可能でしょうか？

行動規範の内容に同意します

回答1件

ベストアンサー

コードの記載がないので、設問の意味を把握しきれていないのですが、以下のような感じでしょうか？

html
1<div class="wrap">
2  <div class="nav">
3    nav<br>
4    nav<br>
5    nav<br>
6    nav<br>
7    nav<br>
8    nav<br>
9  </div>
10
11  <main>
12    main<br>
13    main<br>
14    main<br>
15    main<br>
16    main<br>
17    main<br>
18    main<br>
19  </main>
20</div>

css
1body {
2  text-align: center;
3}
4
5.wrap {
6  margin: 0 auto;
7  position: relative;
8  width: 200px;
9}
10
11main {
12  background: #0ff;
13}
14
15.nav {
16  background: #00f;
17  right: -125px;
18  position: absolute;
19  width: 100px;
20}