宽度自适应，且内容右对齐

Question

如图所示的一个下拉菜单，想让菜单的宽度自适应，而不是和选项框同宽。但是按钮部分又需要右对齐。

当使用浮动，将按钮部分右对齐后，列表的宽度就无法自适应了。

所以，应该如何写，才能做到两个需求都能满足呢。

Answer 1

看你的描述，需要右对齐的内容（两个button）的宽度应该是固定的，如果是这样，你可以设置li有一个合适的padding-right属性，让padding-right的大小能包含两个button的宽度，并且和左侧的文本之间有合适的间距，然后在两个button外边包一层父元素，设置

position: absolute;
top: 0px;
right: 0px;

因为是相对于li定位，所以需要把li设置为定位的父元素position: relative；
效果截图如下：

Answer 2

你这个改了后的怎么感觉看起来像是没有清浮动导致的。。。。。。。

话说回来，其实我觉得你可以试试把li用display:flex然后设置justify-content:space-between应该就可以了，我试验的时候效果是这样的。

Answer 3

简单,你给ul设置
display: inline-block;
li设置
width:100%;
a设置
float：right