css 溢出的解决方法：隐藏;子例外？

im9ewurl 于 2023-05-19 发布在其他

关注(0)|答案(2)|浏览(133)

我想在.preview和.shortcut之外显示一个关闭按钮，这两个按钮都有overflow属性：隐藏位置：absolute不起作用，我不知道如何解决这个问题，因为父div动态调整大小。
任何帮助都将不胜感激
https://dl.dropboxusercontent.com/u/12598822/close_revert.html

.shortcut {
  overflow: hidden;
  /*border: 1px solid blue;*/
  position: relative;
  overflow: hidden;
  display: inline-block;
}

.preview {
  width: 90%;
  height: 75%;
  margin: auto;
  border: 1px solid #aaaaaa;
  /*-webkit-border-image: -webkit-gradient(linear, left top, left bottom, from(white), to(black));
        */
  position: relative;
  -webkit-border-radius: 3px;
  overflow: hidden;
  -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, .15);
  /*-webkit-box-shadow: 0 0 10px rgba(0,0,0,.15);*/
}

<div class="shortcut" id="3">
  <div class="preview thumbs">
    <a class="cross" id="crosshidden" href="#"></a>
    <a class="link" href="http://master.elementaryos.org/developer">
      <img class="thumb" src="http://image.thum.io/get/http://www.google.com/" title="Google">
    </a>
  </div>
  <div class="title">Google</div>
</div>

css

来源：https://stackoverflow.com/questions/16223934/workaround-for-overflowhidden-child-exception

2条答案

按热度按时间

dsekswqp1#

这不能工作，但你提供的标记+css不会创建你的dropbox页面的布局。无论如何要修复它，请尝试以下操作
1)从div.shortcut和.preview类中删除overflow: hidden
2)添加以下规则到你的CSS

.preview a{
    display: block;
    height: 100%;
    overflow: hidden;
}

更新

与此问题无关，但您也希望将.cross规则的background样式设置为以下样式（后台不重复）

background: url("http://www.lngbahrain.com/uploadedImages/EventRedesign/Dubai/2013/January/21276001/Assets/lightbox_close_button.png") no-repeat scroll 0 0 transparent

赞(0）回复(0）举报 2023-05-19

vtwuwzda2#

试试这个：

<div class="shortcut" id="3">
    <div class="preview thumbs">
        <div class="whatever_class" style="height: 100%; overflow: hidden;">
            <a class="link" href="http://master.elementaryos.org/developer">
                <img class="thumb" src="http://api.webthumbnail.org?width=500&height=499&format=png&screen=1024&url=dribbble.com" title="Developer | elementary OS">
            </a>
        </div>
        <a class="cross" id="crosshidden" href="#"></a>
    </div>
    <div class="title">Dribbble</div>
</div>

然后，从.shortcut和.preview类中删除overflow: hidden。
只要确保我设置为class="whatever_class"的div得到我放置在其中的style。只是一个快速的解决方案。

赞(0）回复(0）举报 2023-05-19

我来回答

css 溢出的解决方法：隐藏;子例外？

2条答案

更新

相关问题

热门标签

最新问答