css - 需要 Bootstrap 输入字段背景图像为 "full bleed"，无边框

Question

我有这个表格:

无论我制作的图像有多大，或者我如何调整字段的大小，白色边框始终存在。我该怎么做才能使白色边框不在每个输入字段左侧蓝色图标的顶部、左侧和底部周围。

这是 HTML:

<form role="form" class="">
    <fieldset class="">
        <div class="form-group"> 
            <input type="email" class="form-control no-shadow margin-bottom20 email-field form-group" id="InputEmail" placeholder="email" required="" style="border-radius:0px;">
            <input type="password" class="form-control no-shadow password-field" id="InputPassword" placeholder="password" required="" style="border-radius:0px;">
            <button type="submit" class="btn margin-top45 btn-lg bg-transparent bg-transparent-hover no-shadow text-center" data-toggle="tooltip" style="border : solid 3px #99cc33;color:#ffffff;">Log In</button>
        </div>
    </fieldset>
</form>

这是 CSS:

.email-field
{
    background-image: url('../images/email-input-icon.png');
    background-repeat: no-repeat;
    background-position: null;
    background-clip: border-box;
}

.password-field
{
    background-image: url('../images/password-input-icon.png');
}

.margin-bottom20
{
    margin-bottom: 20px !important;
}

.form-control
{
    color: #34495e;
    font-size: 16px;
    line-height: 1.467;
    padding: 8px 12px 8px 66px;
    height: 54px;
    -webkit-appearance: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: border .25s linear, color .25s linear, background-color .25s linear;
    transition: border .25s linear, color .25s linear, background-color .25s linear;
    background-repeat: no-repeat;
}

.form-group
{
    position: relative;
    margin-bottom: 20px;
}

.form-group.focus .form-control, .form-control:focus
{
    border-color: #1abc9c;
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

Answer 1

.form-control, .form-control:focus {
  border-color:Transparent;
}