显示：Firefox中的表溢出父div答案

【问题标题】：Display: table overflow parent div in firefox显示：Firefox中的表溢出父div
【发布时间】：2013-12-20 09:02:30
【问题描述】：

问题和疑问

当使用 display:table 和 display:table-cell 垂直对齐元素时，Firefox 会溢出父容器宽度。查看实时演示以检查代码。

HTML

<div class="hew storeloader" href="/stores/arti-zen-eskilstuna-city">
    <div class="holder hp100" style="height: 325px;">
        <div class="storecontent">
            <img alt="" src="/img/logo-white.svg">
            <p>Arti.Zen Eskilstuna City</p>
        </div>
    </div>
</div>

CSS

section.stores .storeloader {
    width: 47.82609%;
    float: left;
    margin-right: 4.34783%;
    display: inline;
    overflow: hidden;
    background: #000;
    color: #FFF;
    text-align: center;
    margin: 10px 0;
    position: relative;
    cursor: pointer;

section.stores .storeloader .holder {
    width: 100%;
    display: table;
}
section.stores .storeloader .holder .storecontent {
    display: table-cell;
    padding: 0 10px;
    text-align: center;
    vertical-align: middle;
    text-transform: capitalize;
    font-size: 20px;
}

【问题讨论】：

它在 Chrome 上运行良好。你能给我们看一下 Firefox 的预览吗？
在火狐上也是如此。
由table-layout: fixed;在容器上使用display: table解决。
回答您自己的问题并接受它，以便其他可能面临相同问题的人可以通过查看此帖子来解决他们的问题。

标签： html css firefox

【解决方案1】：

由table-layout: fixed;在容器上使用display: table解决

【讨论】：