微信小程序按钮和输入框调整到一行并自动调整大小

    <input class="mail-input" placeholder="或手动输入物品编号" bindinput="inputMailNumber" value="{{mailNumber}}"/>
    <button class="scan-btn" bindtap="scanBarcode">扫码获取物品编号</button>
    <button class="query-btn" bindtap="search">点击查找</button>
    
</view>代码实现按钮输入框调整到一行中，自动调整大小怎么修改wxml.wxss代码内容：要将按钮和输入框调整到同一行并自动调整大小，可以按照以下步骤进行修改：

在wxml文件中，将按钮和输入框的代码放在同一个<view>标签中，以便它们在同一行显示：

<view class="input-container">
  <input class="mail-input" placeholder="或手动输入物品编号" bindinput="inputMailNumber" value="{{mailNumber}}"/>
  <button class="scan-btn" bindtap="scanBarcode">扫码获取物品编号</button>
  <button class="query-btn" bindtap="search">点击查找</button>
</view>

在wxss文件中，为input-container类添加样式，使其显示为一行，并设置按钮和输入框的宽度自动调整：

.input-container {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.mail-input {
  flex: 1;
  margin-right: 10px; /* 可根据需要调整按钮与输入框的间距 */
}

.scan-btn,
.query-btn {
  flex-shrink: 0;
  width: auto;
  margin-left: 10px; /* 可根据需要调整按钮之间的间距 */
}

这样修改后，按钮和输入框将会在同一行显示，并根据内容自动调整大小。