HTML和CSS下拉框旁边有文本框

Question

我有点麻烦，我正在尝试制作一个下拉框，它与旁边的文本框连接。我到处都能看到，无法找到这样的东西。它看起来像这样：

我该怎么做？

Answer 1

尝试这样的事情：

＆＃13;

＆＃13;

select,
input {
  margin: 0;
  padding: 0;
  border: 1px solid black;
}
select {
  height: 30px;
  border-radius: 20px 0 0 20px;
  padding-left: 5px;
  border-right: 0;
}
input {
  height: 28px;
  border-radius: 0 20px 20px 0;
  padding-left: 5px;
}

＆＃13;

<select>
  <option>Option 1</option>
  <option>Option 2</option>
  <option>Option 3</option>
  <option>Option 4</option>
</select><input type="text" />

＆＃13;

＆＃13;

＆＃13;

Answer 2

 <select>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select><input type="text">