Css 如何获得一个固定宽度的按钮，输入字段流畅地占用剩余的可用空间

在CSS中，是否可以只获得输入字段和按钮的垂直对齐，就像在我的笔中一样：

然后管理右侧对齐的按钮在输入字段的左侧具有固定的宽度和边距，并且输入字段流畅地填充剩余空间

右键可以使用浮标，但该解决方案按钮不再垂直对齐在中间。（并且获取输入字段将填充我完全没有管理的剩余空间。：/

---

您可以使用浮动元素的特定性和块元素的布局

首先在流中，在包装输入的块之前浮动。

溢出处的包装：隐藏
和
宽度：100%；

请参阅测试：
优雅的解决方案！我只有一个问题。我有几个其他视口。在我的最小视口中，当没有应用网格时，输入字段和按钮作为块级元素相互对齐。在您的解决方案中，您已交换了输入和按钮元素在html标记中的位置。在所有其他视口中，我是我能适应你的解决方案，但在那种情况下，我怀疑我能做到（您可以使用mediaquerie、浮动伪元素和clear将按钮放在输入区域下，或者使用
display:flex；
flex-direction
和
order
：酷！我在这一点上有点头晕。谢谢，这就成功了。）