Estou com esse pequeno problema. Tenho um layout que precisa estar exatamente como me passaram, dentro eles as definições dos input do tipo text
e select
.
No Google Chrome, funcionou tudo maravilhosamente, já que a seta ficou bonitinha, como no exemplo:
.form-control
{
background-color: #fff;
border-radius: 15px;
border: 2px solid #ccc;
font-size: 16px;
margin-top: 5px;
min-height: 57px;
outline: none;
padding: 15px 10px;
transition: border-color .1s linear;
width: 100%;
box-sizing: border-box;
}
<input class="form-control" />
<select class="form-control">
</select>
Resultado no Google Chrome:
No Firefox, por sua vez, a seta é renderizada dessa forma:
Como estilizar essa seta do <SELECT>
para ficar igual em todos os navegadores?