html - 页脚在 IE11 上出现损坏

Question

我网站的页脚在 IE11 浏览器上似乎已损坏，但在其他浏览器和平台上显示良好:

页脚的 HTML 代码:

 <div id="contact" class="offset">
        <footer>
            <div class="row">
                <div class="col-md-5">
                    <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
                    <svg id="Layer_2" data-name="Layer 2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 866 220"><title>BWA_Logo</title><!-- here I have the svg logo -->
                    <p>At our core is a collection of design and development solutions that represent everything your business needs to compete in the modern marketplace.</p>
                    <strong>Headquarters</strong>
                    <p>7120 Smoke Ranch Rd<br>Las Vegas, NV 89128</p>
                    <strong>Contact Info</strong>
                    <p>(702) 435-6947<br>info@blainewarren.com</p>
                </div>

            <div class="col-md-7">
                <h3 id="contact-us">Contact Us</h3>

                <form id="contact-form" method="post" action="contact.php">

                    <div class="messages"></div>
                    <div class="controls">

                        <div class="form-group">
                            <input id="form_name" type="text" name="name" class="form-control" placeholder="Enter your name." required="required">
                        </div>

                        <div class="form-group">
                            <input id="form_email" type="email" name="email" class="form-control" placeholder="Enter your email." required="required">
                        </div>

                        <div class="form-group">
                            <textarea id="form_message" name="message" class="form-control" placeholder="Add your message." rows="4" required="required"></textarea>
                        </div>

                        <input type="submit" class="btn btn-outline-light btn-sm" value="Send message">

                    </div>

                </form>

            </div>

            <hr class="socket">
            &copy; Blaine Warren Advertising, LLC.<br/>
            All Rights Reserved

        </div> <!--- End of Row -->
    </footer> <!--- End of Footer -->

</div>
<!--- End Contact Section -->

相关CSS:

    /*============= CONTACT SECTION =============*/

footer {
    /*background: url('img/footer/footer.png') no-repeat;*/
    /*background-color: #40474e;*/
    background-color: #231F1F;
    background-size: cover;
    color: white;
}
footer .row {
    background-color: #231F1F;
    /*background-color: rgba(57, 63, 70, 0.85);*/
    padding: 1rem 2rem 3rem;
}
footer img {
    height: 2rem;
    margin: 1.5rem 0;
}
footer a {
    color: white;
}
footer svg.svg-inline--fa {
    font-size: 1.6rem;
    margin: 1.2rem .5rem 0 0;
}
footer svg.svg-inline--fa:hover {
    color: #1ebba3!important;
}
footer h3 {
    text-transform: uppercase;
    margin: 1.5rem 0;
}
/*--- Contact Form --*/
.form-group {
    margin-bottom: 1.3rem;
}
.form-control {
    background-color: #53595f;
    border-radius: 0;
    border: .15rem solid #666b71;
    color: white!important;
    font-size: 1.1rem;
}
.form-control:focus {
    background: #53595f;
    border: .15rem solid #666b71;
}
.form-group input::placeholder,
.form-group textarea::placeholder {
    color: #b2b5b8!important;
}
input.btn {
    cursor: pointer;
}
hr.socket {
    border-top: .2rem solid #666b71;
    width: 100%;
}

可以在以下位置查看该页面: https://blainewarren.com/任何有关如何解决此问题的建议都将受到赞赏:客户端在 Windows 上使用 IE11。为此，我使用了 Udemy Bootstrap 类(class)教程中的 Nuno 主题，以及 Bootstrap 4、HTML、CSS 和 jQuery。

Answer 1

在尝试了多种方法都无济于事之后，我终于想出了如何通过将其添加到 css 来修复它:

_:-ms-fullscreen, :root .footer-logo-svg {
    height: 45%;
}

并将类“footer-logo-svg”添加到页脚中的 svg Logo 。至此，该bug修复成功。