使元素溢出到父元素之外答案

【问题标题】：Making an element overflow outside parent element使元素溢出到父元素之外
【发布时间】：2015-10-27 02:23:39
【问题描述】：

我正在使用 Material Design Lite 创建卡片。我在卡片中添加了一个菜单，但菜单的内容只出现在卡片中。我希望它像这个例子一样溢出 (http://www.getmdl.io/components/index.html#menus-section)

我的小提琴：http://jsfiddle.net/brizzz_/te5Lpw8m/

<div class="mdl-card__menu">
                <button id="more_reddit" class="mdl-button mdl-button--icon mdl-js-button mdl-js-ripple-effect">
                  <i class="material-icons">more_vert</i>
                </button>
                 <ul id="more-reddit-menu" class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect"
                  for="more_reddit">
                <li class="mdl-menu__item">Some Action</li>
                <li class="mdl-menu__item">Another Action</li>
                <li class="mdl-menu__item">Disabled Action</li>
                <li class="mdl-menu__item">Yet Another Action</li>
                <li class="mdl-menu__item">Even Another Action</li>
              </ul>
         </div>

【问题讨论】：

标签： html css material-design

【解决方案1】：

您的.mdl-card CSS 规则设置了overflow: hidden;。

我不确定这是否是故意的，但删除它会达到您想要的效果。如果您必须在该元素上有overflow: hidden;，则需要设计另一个解决方案。就像将菜单放在该容器外并绝对定位一样。

【讨论】：

【解决方案2】：

你是否在样式表中添加了溢出？

【讨论】：