Vaadin - 在CSSLayout中对齐元素

Question

我有一个CSSlayout，其中有三个元素，如label，label和bordereless button（X），就像icon一样。我已经设置了setSizeUndefined，我希望有一个类似的布局：带有额外空间的标签，因为标签的大小可以是0 px到200px。然后我需要另一个标签然后对齐到最右边的删除按钮，就像X.我真的不能这样做，很烦人。这应该适用于移动设备，所以我认为固定尺寸不是那么好主意。浮动权限无法使用按钮图标...

<div class="v-csslayout v-layout v-widget">
    <div class="v-label v-widget uploadedRow-fileName v-label-uploadedRow-fileName v-label-undef-w">logo.jpg</div>
    <div class="v-label v-widget uploadedRow-description v-label-uploadedRow-description v-label-undef-w">Description1</div>
        <div style="width: 1px;" id="logo.jpg" class="v-button v-widget icon-only v-button-icon-only borderless v-button-borderless uploadedRow-deleteButton v-button-uploadedRow-deleteButton v-has-width" role="button" tabindex="0"><span class="v-button-wrap"><span class="v-icon FontAwesome"></span><span class="v-button-caption"></span></span></div>
   </div>

Answer 1

尝试向关闭按钮添加一个浮动。

<div style="width: 1px; float: right;" id="logo.jpg" class="v-button v-widget icon-only v-button-icon-only borderless v-button-borderless uploadedRow-deleteButton v-button-uploadedRow-deleteButton v-has-width" role="button" tabindex="0"><span class="v-button-wrap"><span class="v-icon FontAwesome"></span><span class="v-button-caption"></span></span></div>