绝对位置高度100％

Question

我在显示div时遇到问题。 由于某种原因，它没有显示内部div。

父div的位置是相对的，而子div的位置是绝对的。

这是演示http://jsfiddle.net/squidraj/6R3Hr/6/

HTML代码：

<div class="page-center">
  <div class="question_slide inidfeedback">Test</div>
</div>

CSS代码：

.question_slide {
  background: #000000;
  height: 569px;
  width:100%
}

.question_slide {
  overflow: hidden;
  position: absolute;
  top: 0;
 width: 100%;
}
.page-center {
  margin: 0 auto;
  max-width: 1100px;
  overflow: hidden;
  position: relative;
  text-align: center;
  width: 100%;
}

Answer 1

只是交换他们的立场。

.question_slide {
overflow: hidden;
position: relative;
top: 0;
width: 100%;
}
.page-center {
margin: 0 auto;
max-width: 1100px;
overflow: hidden;
position: absolute;
text-align: center;
width: 100%;
}

这是一个演示： http : //jsfiddle.net/6R3Hr/3/

Answer 2

编辑：

如果必须执行overflow：hidden，那么必须为相对div指定一个高度：

.page-center {
    margin: 0 auto;
    max-width: 1100px;
    position: relative;
    text-align: center;
    width: 100%;
    overflow:hidden;
    height:100px;
}

只需选择适合您的高度即可。

这是与您的代码一起工作的jsfiddle。

Answer 3

给它一个高度样式。 由于唯一的内容是相对放置的，因此它没有任何固有的高度值，并且由于溢出是隐藏的，因此不在屏幕上。

http://jsfiddle.net/squidraj/6R3Hr/2/

.page-center {
  margin: 0 auto;
  max-width: 1100px;
  overflow: hidden;
  position: relative;
  text-align: center;
  width: 100%;
  height:20px;
}