Inte rnet Исследуйте CSS - Настройте CSS, чтобы он работал правильно в IE и Chrome / Firefox

Question

У меня есть некоторые стили, которые не работают правильно только в IE. Я не работаю с внешним интерфейсом, поэтому у меня возникают проблемы с настройкой css для правильной работы в IE, Chrome и Firefox.

Как сделать оба изображения централизованными, как в chrome / Firefox?

IE ScreenShot (плохо)

Chrome (штраф)

HTML

<div class="py-5">
<div class="container">
    <div class="row">
        <div class="p-5 col-lg-8" style="margin-top:40px">
            <div class="row">
                <div class="container h-100">
                    <div class="d-flex justify-content-center h-100">
                        <div class="user_card">
                            <div class="d-flex justify-content-center">
                                <div class="brand_logo_container">
                                    <img src="~/Content/img/logoRveAjustada.png" class="brand_logo" alt="Logo">
                                </div>
                            </div>
                            <div class="d-flex justify-content-center form_container">
                                @using (Html.BeginForm("Login", "Account", new { ReturnUrl = ViewBag.ReturnUrl }, FormMethod.Post, new { @class = "form-horizontal", role = "form" }))
                                {
                                    @Html.AntiForgeryToken()
                                    <h5>Efetuar Login</h5>
                                    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
                                    <div class="form-group" id="divMessage" style="display:none">
                                        <div class="alert alert-danger" id="textMessage">teste</div>
                                    </div>
                                    <div class="form-group" id="txtLogin">
                                        <div class="input-group mb-4">
                                            <span class="input-group-text"><i class="fa fa-user"></i> </span>
                                            @Html.TextBoxFor(m => m.Email, new { placeholder = "Chave", @class = "form-control col" })
                                            <div class="col-md-12">
                                                @Html.ValidationMessageFor(m => m.Email, "", new { @class = "text-danger" })
                                            </div>
                                        </div>
                                        <div class="input-group mb-4">
                                            <div class="input-group">
                                                <span class="input-group-text" style="padding-left:15px"><i class="fa fa-unlock-alt"></i> </span>
                                                @Html.PasswordFor(m => m.Password, new { placeholder = "Senha", @class = "form-control" })
                                                <div class="col-12">
                                                    @Html.ValidationMessageFor(m => m.Password, "", new { @class = "text-danger" })
                                                </div>
                                            </div>
                                        </div>
                                    </div>                                  
                                }
                            </div>

                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
</div>

css тело, html {поле: 0; отступы: 0; высота: 100%; }

#txtLogin{
    padding-top:10px;
    padding-bottom:10px;
}

.user_card {
    height: 460px;
    width: 420px;
    margin-top: auto;
    margin-bottom: auto;
    background: #DDE2E7;
    position: relative;
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: 10px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    -moz-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    border-radius: 5px;
}

.brand_logo_container {
    position: absolute;
    height: 170px;
    width: 170px;
    top: -75px;
    border-radius: 50%;
    background: #fff;
    padding: 10px;
    text-align: center;
}

.brand_logo {
    height: 150px;
    width: 150px;
    border-radius: 50%;
    border: 2px solid white;
}

.form_container {
    margin-top: 100px;
}

.login_btn {
    width: 100%;
    background: #006298 !important;
    color: white !important;
}

 #padding {
    padding-left: unset;
    padding-right: unset;
}

.login_container {
    padding: 0 2rem;
}

 .input-group-text {
    background: #006298 !important;
    color: white !important;
    border: 0 !important;
    border-radius: 0.25rem 0 0 0.25rem !important;
}