Html 父Div=左浮动。子Div不显示文本

所以我有一个父div（框1）和一个float:left。我的孩子div（悬停状态）基本上只是一个悬停状态。子div有2个文本元素和一个下划线。下划线显示，但文本元素不显示。如果您查看JSFIDLE，并将鼠标悬停在白色框上，就会明白我的意思

        <div class="box one">
            <div class="hover-state">

                <h3>This Artist</h3>
                <div class="line"></div>
                <h4>some text</h4>

            </div>
        </div>

这位艺术家
一些文本

---

您在

花名册中有
字体大小：0
，因此它使所有孩子都继承。将代码重置为：

.roster > div {
     font-size: 1rem; 
}

看到它工作了吗

您在
花名册中有
字体大小：0
，因此它使所有孩子都继承。将代码重置为：

.roster > div {
     font-size: 1rem; 
}

看到它工作了吗

删除或更改
字体大小。这由所有子级继承，不显示任何内容：

.roster > div {
  font-size: 10pt;
}

小提琴：
删除或更改
字体大小。这由所有子级继承，不显示任何内容：

.roster > div {
  font-size: 10pt;
}

小提琴：
这真让我烦透了。。。但是，您应该使用border属性，而不是一个有线条的div:）这真的让我很烦。。。但是，您应该使用border属性，而不是带线条的div:）