Safari

Question

我在Safari浏览器中使用2个文本行标题进行垂直对齐问题时出现问题。虽然Chrome，Firefox和IE工作完美无瑕，但Safari通过第二个文本行标题而不是图像排列。这是问题所在：

Chrome，Firefox和IE运行良好： http://postimg.org/image/mvxxkkpb1/

Safari显示错误的对齐方式 http://postimg.org/image/5splknbcl/

这是关于img

.polaroid { 
    width: 185px; 
    height: 240px; 
    padding: 34px 36px 26px 39px; 
    display: inline-block; 
    overflow: hidden; 
    margin: 0px auto 20px auto; 
    zoom: 1; 
}  

.polaroidimage { 
    width: 185px; 
    height: 170px; 
    padding: 0px; 
    margin: 0px; 
    display: block; 
    overflow: hidden; 
}  

这里有关于标题（第一个标题行）和日期（第二个标题行）

.polaroidtitle { 
    font-family: "Times New Roman"; 
    font-size: 11px; 
    font-weight: normal; 
    letter-spacing: 2px; 
    text-transform: uppercase; 
    width: 170px; 
    height: 45px; 
    overflow: hidden; 
    line-height: 1.1em; 
    padding: 5px 0px 0px 0px; 
    color: #111111; 
    text-align: left;
} 
div.polaroidtitle a { 
    color: #111111; 
    text-decoration: none;   
} 
div.polaroidtitle a:hover { 
    color: #888888;  
} 
.polaroiddate { 
    font-family: "Times New Roman"; 
    font-size: 11px; 
    font-weight: normal; 
    letter-spacing: 2px; 
    text-transform: uppercase; 
    width: 170px; 
    height: 19px; 
    overflow: hidden; 
    line-height: 1.1em; 
    padding: 3px 0px 0px 0px; 
    color: #888888; 
    text-align: left; 
}  

有什么想法吗？ 谢谢！

Answer 1

也许这会对你有所帮助：

HTML

<div class="wrapper">
    <div class="img-wrapper">
        <div class="img"></div>
        <p>text</p>
    </div>
    <div class="img-wrapper">
        <div class="img"></div>
        <p>text</p>
    </div>
    <div class="img-wrapper">
        <div class="img"></div>
        <p>text</p>
    </div>
</div>

的CSS：

.wrapper {
    border-top: 2px solid red;
    border-bottom: 2px solid red;
}

.img-wrapper {
    width: 100px;
    display: inline-block;
}

.img {
    background: #ccc;
    height: 100px;
    width: 100px;
    display: inline-block;
}


p {
    color: #000;
    display: block;
}

请参阅https://jsfiddle.net/d1Lsq9jq/