Question

我正在尝试用语义ui创建一个简单的web ui。

我想要一个带有菜单的侧边栏，在某些项目中会有子项目......难道不应该那么辛苦吗？

<div class="ui vertical menu sidebar teal">
   <div class="menu">
   <a class="item" target="_blank" href="http://semantic-ui.com/modules/dropdown.html">
     Example
   </a>
   <div class="ui left pointing dropdown link item">
      <i class="dropdown icon"></i>
      Messages
     <div class="menu">

如何让子项在正常页面内容上“跳出”侧边栏？如果单击示例中的“消息”，将显示菜单（观察底部的滚动条以显示），但由于这些是侧边栏的子项，因此它们将显示在侧边栏中。但我希望他们能够超越正常的内容！我没有通过摆弄z-index来解决这个问题。

Answer 1

如果侧栏配置为使用overlay转换，则可以通过指定

来修复

.ui.sidebar {
    overflow: visible !important;
}

取自http://jsfiddle.net/59174tt1/2/

Answer 2

它的位置组合：固定和溢出.ui.sidebar。本文可能有所帮助：http://css-tricks.com/popping-hidden-overflow。

另一种选择可能是使用手风琴来保持侧边栏内的所有内容。

语义UI边栏＆amp;下拉式菜单

2 个答案: