"float:right"不会将div放在右侧

Question

我不明白为什么我不能让这个工作.我正在制作这个CSS垂直侧面菜单,我希望它位于窗口的右侧.所以我有菜单的div,我将它包装在另一个div中,将其设置为向右浮动.

问题是,它被困在左侧.我希望能够滚动它,但将页面的其余部分保留在同一个地方.这是小提琴:http: //jsfiddle.net/xQgSm/121/

这是代码的一部分:

<div id="wrap" style="height: 100%; position: absolute; overflow-y: scroll; float: right">
    <div id='cssmenu'>
    <ul>
   <li class='active'><a href='#'><span>Home</span></a></li>
   <li class='has-sub'><a href='#'><span>Products</span></a>
      <ul>
         <li><a href='#'><span>Product 1</span></a></li>
         <li><a href='#'><span>Product 2</span></a></li>
         <li><a href='#'><span>Product 3</span></a></li>
      </ul>
   </li>

Answer 1

你需要你的包装器成为width: 100%页面.

尝试添加:

<div id="wrap" style="height: 100%; width: 100%; position: absolute; overflow-y: scroll;">