Question

我需要对齐跨度。问题出在移动设备上，它们分为两列，每列各有两个单元格。最右边一列中的最后一个在所有列的左边。第一行完美对齐。我该如何解决？

<div id="topbar" style="background-color:#355A73; color:white;">
    <div class="col-full">
        <span style="display:inline-block;"><div class="tooltip"><i class="far fa-clock" style="margin-right:5px;margin-left:5px;"></i>SOme text<span class="tooltiptext"><i class="fas fa-angle-double-right" style="color:white;margin-right:5px;"></i>Some text</span>
        <span style="display:inline-block;"><div class="tooltip"><i class="fas fa-lock" style="margin-right:5px;margin-left:5px;"></i> Some Text <span class="tooltiptext"><i class="fas fa-angle-double-right" style="color:white;margin-right:5px;"></i>Some Text</span></div></span>
        <span style="display:inline-block;"><div class="tooltip"><i class="fas fa-check-circle" style="margin-right:5px;margin-left:5px; "></i>Some Text <span class="tooltiptext"><i class="fas fa-angle-double-right" style="color:white;margin-right:5px;"></i>Some Text</span>
        <span style="display:inline-block;"><div class="tooltip"><i class="fas fa-money-bill" style="margin-right:5px;margin-left:5px;"></i>Some Text<span class="tooltiptext"><i class="fas fa-angle-double-right" style="color:white;margin-right:5px;"></i>Some Text</span></div></span>
    </div>
</div>

站点为quickdiagnostics.co.uk

Answer 1

<div style="display: table;">
    <div style="display: table-cell;">
    </div>
</div>

display: table; =>对于父级。

display: table-cell; =>对于子div

如何使元素表现得像表格对齐

1 个答案: