如何更改搜索栏长度

Question

我想更改搜索栏的大小，但是当我声明CSS高度时，搜索栏会丢失。

Picture 1

<div id="medProviders_filter" class="dataTables_filter"><label><span class="hidden-xs">Search: </span> <input type="search" class="" placeholder="" aria-controls="medProviders"></label></div>

搜索栏

<input type="search" class="" placeholder="" aria-controls="medProviders">

Picture 2

Answer 1

请勿在输入周围使用标签，此示例非常简单且有效。

#medProviders_filter {
  width: 80%;  
  margin: 30px auto;
}

#medProviders_filter label, #medProviders_filter input {
  display: inline-block;
}

#medProviders_filter label {
  width: 70px;
  line-height: 30px;
}

#medProviders_filter input {
  width: calc(100% - 70px);
  padding: 5.5px;
}

<div id="medProviders_filter" class="dataTables_filter">
  <label for="search">Search: </label><!--
  --><input id="search" type="search" class="" placeholder="" aria-controls="medProviders">
</div>

Answer 2

您对类型后的“ i”怎么处理？那是要在那里吗？