CSS中的dropup菜单？

Question

我正在寻找一种构建dropup菜单的方法。基本上，我有一个网站底部有不同的按钮，其中一些应该有下拉菜单，以便在鼠标悬停时上面有几个按钮。

哦，我希望有一个没有大型库甚至没有javascript的解决方案（但这只是因为它更干净，使用javascript的解决方案也可以工作）。

编辑：以下是一些代码：

HTML：

<div class="toolbarElement" id="toolbarViewUsers">
    <img src="images/usericon.png" />
    List users
</div>
<div class="toolbarElement" id="toolbarSettings">
    <img src="images/settings.png" />
    Settings
</div>
<div class="toolbarElement" id="toolbarLogout">
    <img src="images/logout.png" />
    Logout
</div>

CSS：

.toolbarElement img {
 display: block;
}

.toolbarElement {
 float: left;
 text-align: center;
 margin-left: 3px;
 margin-right: 3px;
}

它的外观如下：

编辑2：现在我尝试了这个，但我仍然不知道如何将子菜单放在toolbarElement上面：

CSS：

.toolbarElement {
 float: left;
 text-align: center;
 margin-left: 3px;
 margin-right: 3px;
 position: relative;
}

.submenu {
 position: absolute;
 bottom: 0px;
 left: 0px;
}

HTML：

<div class="toolbarElement" id="toolbarSettings">
 <img src="images/settings.png" />
 Settings
 <div class="submenu">
  Hallo
 </div>
</div>

Answer 1

我认为这是一个很好的例子：

jQuery multi-tiered drop-up menu

观看演示here。

BTW只是一个警告，演示已经在左下角向下拉，称我为白痴，但在我看到之前我刷新了5次：）

祝你好运