【CSS】flex布局使得一个元素向左靠齐，两个以上元素向右靠齐

场景

一个li父节点，里边有input元素和两个button元素。

要求

input放在左边，两个button放在最右边

解决方法

1. 先将父元素的布局方式设置为flex，并向右靠齐

   li {
     display: flex;
     justify-content: flex-end;
     ...
   }
   

2. 设置input的右边距为auto，input会直接顶开从而向左边靠齐

   li input {
   	margin-right: auto;
   	...
   }
   

设置完后效果如下：