CSSのposition:fixed;に関する質問です。

質問

position:fixed;で画面下部に固定表示させたdivの中にメニュー画像を入れているのですが、
表示領域・窓サイズがこのdivより小さくなった場合、
ある大きさ以下からスクロールバーを表示させることは可能でしょうか？
現状画面右端からどんどん消えていってしまいます。

下記がソースになります。
＜HTML＞
<div id="wrapper">
<div id="main">
割愛
</div>
<div id="topmenu">
<ul>
<li id="topmenu01"><a href="">link01</a></li>
<li id="topmenu02"><a href="">link02</a></li>
<li id="topmenu03"><a href="">link03</a></li>
<li id="topmenu04"><a href="">link04</a></li>
<li id="topmenu05"><a href="">link05</a></li>
</ul>
</div>
</div>

＜CSS＞
div#wrapper{
z-index:100;
background:url(images/bg.png) no-repeat left top;
width:1004px;
margin:0 auto;
}
div#topmenu{
position:fixed;
bottom:0;
vertical-align:bottom;
margin:0 auto;
overflow:hidden;
width:1105px;
height:332px;
display:block;
}

div#topmenu ul{
margin:0 auto;
overflow:hidden;
position:relative;
top:-120px;　/* 略した部分の要素に関連して上にあげています*/
}

div#topmenu ul li{
float:left;
position:relative;
}

div#topmenu ul li a{
display:block;
}

回答No.2

nanami0224

div　topmenuの部分が、下部に固定されるメニューですよね。
（下部にあるのにtopというのが微妙かなと思いましたが・・）

link01link02などが表示されないのは、ulに対してtopが-120に
なっているからでしょう。

私はIEとez-html（フリーツール）で試しましたが、勝手に
スクロールバーが出て、1100pxくらいぶんまで表示されました。
気になるのは、wrapeerのwidthは1004なのに、その中にある
topmenuのwidthがそれより大きい1105な所です。

ブラウザによって、この矛盾をどう取るかが変わっている
のではないでしょうか？

それか、割愛されたヘッダーの<?xml　－－－
や＜DOCUMENT　あたりの指定が関係しているようですね。

お礼

ありがとうございます！
ちょっと今出先なので帰ってから全ての部分をなるべくわかりやすくして投稿します。

回答No.1

noname#119957

(1)link01～05は、まったく表示されませんが・・どうなっているのでしょうねえ。
(2)スクロールバーもありませんね。
(3)dreamwwaverとfirefoxで上のコーディングを見ましたが、さっぱりわかりません。
(4)HTMLはdoctype宣言を付けないと話が出来ませんねえ。

お礼

ご回答ありがとうございます。
えっと、ともにBODY内および外部CSS内の記述ですが、
イチから全て載せた方がいいのでしょうか？

こちらのサービスにあまり慣れてなく、お手数おかけしてもうしわけありません。