如何使用省略号截断行中间的内联元素而不使用连字符

Question

我有

<div style="text-align: justify; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;">
    <span style=" float: right;">
        <span><a href="#"><i class="fa fa-caret-square-o-up fa-fw"></i></a></span>
        <span><a href="#"><i class="fa fa-search fa-fw"></i></a></span>
        <span><a href="#"><i class="fa fa-question fa-fw"></i></a></span>
        <span><a href="#"><i class="fa fa-ellipsis-v fa-fw"></i></a>           </span>
    </span>
    <span>
        <span><a><i class="fa fa-bars fa-fw"></i></a></span>
        <span>start long text long text long text long text end</span>
    </span>
    <span style="content: ''; display: inline-block; width: 100%; height: 0; font-size:0; line-height:0;"></span>
</div>

因此，我得到了我想要的东西

但我在float: right元素上使用inline。我知道它是在block元素中自动转换的。在中间修剪弦的正确决定是多少？如何最好地实施它？