absolutediv里面的内容不会显示？

Question

我正在尝试创建一个 div 以在单击其相关父项时显示信息。我已经准备好了所有的 JS 来设置它，但是在我 div 之前，我似乎无法在包含所有内容的绝对 div 中显示任何内容。下面，我有一些代码和一个 JSFiddle 重现了这个问题（是的，我的内部文本 class 没有高度，但是有或没有它，问题仍然存在）。 this/can 我让这个工作背后有什么原因吗？我们开始吧：

HTML:

<div class="content-container">
    <div class="content">
        <div class="project" style="margin-bottom:368px;">
            <div id="p-inner" style="">
                <div class="inner-text">
                <p>Test</p>
                </div>
            </div>
       </div>
    </div>
</div>

CSS:

.content-container {
    overflow: auto;
    text-align: center;
    font-size: 0;
}
.project {
    display: inline-block;
    position: relative;
    text-align: center;
    width: 25%;
    max-height: 386px;
    z-index: 2;
    vertical-align: top;
}
#p-inner {
    z-index: 3;
    position: absolute;
    left: 0;
    background: #fff;
    width: 100%;
    height: 368px;
}
.inner-text {
    bottom: 0px;
    width :90%;
}

这是我的 JSFiddle：https://jsfiddle.net/6am4ovqk/ 如果我睡一觉，我几乎是肯定的，明天早上答案会打我的脸，但我仍然想通过提出这个问题来帮助其他有类似问题的人。

Answer 1

因为有font-size:0;在 .content-container

.content-container {
    overflow: auto;
    text-align: center;
    font-size: 20px;
}

给一些font-size大于0的，会显示。

Working Fiddle

absolutediv里面的内容不会显示？

Content inside absolute div won't display?

html

css

css-position