一行中的两个div在safari中不工作

Question

我想让两个div在一行中它可以在IE中工作，但不能在safari和iPhone中工作。在Safari和I phone中，它在一行中显示每个div。

.post-short-footer {
display: table;
width: 100% !important;
padding-bottom: 0px;
min-width: 500px
}
.read-more-post {
height: 100%;
display: table-cell;
vertical-align: middle;
width: 5%;
text-align: left;
font-size: 20px !important;
}
.read-more-post a {
white-space: nowrap;
border-radius: 0.3em;
display: block;
color: white;
}
.post-short-meta-container {
display: table-cell;
width: 95%;
line-height: 1.3;
vertical-align: left;
height: 100%;
}
.post-short-meta-container span {
display: inline-block;
margin: 0.7em;
}

<div class="post-short-footer">
<div class="read-more-post"><i class="fa fa-caret-right" style="color: black;" aria-hidden="true">></i></div>
<div class="post-short-meta-container"><span style="font-size: 13pt; color: black;">Vacuuming</span></div>
</div>

Answer 1

试试下面的代码，希望对你有用。

div is block element, where span is inline element. 
<div class="post-short-footer">
<span class=""><i class="fa fa-caret-right" style="color: black;" aria-hidden="true">></i></span>
<span class=""><span style="font-size: 13pt; color: black;">Vacuuming</span></span>
</div>