其他人也问过类似的问题,但我似乎在努力将 Font Awesome 图标与输入框垂直对齐。当你不使用大小来增加 Font Awesome 图标时它工作正常,但一旦你输入 fa-3x 或类似的东西,就会添加 margin-top。
有没有人有什么想法?
简单的例子是:
<div>
<i class='icon icon-3x icon-camera'></i>
<span id="inputfield">
<input type="text" value="input here">
</span>
</div>
div {
border: 1px solid #ccc;
height: 30px;
margin: 60px;
padding: 4px;
vertical-align: middle;
}
i{
float: left;
}
#inputfield{
line-height: 30px;
float: left;
}
最佳答案
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
<form>
<fieldset>
<legend><i class="fa fa-user" aria-hidden="true"></i></legend>
<input type="text" class="something">
</fieldset>
</form>
关于javascript - 中心输入框和 Font Awesome 图标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44411656/