html - 元素在 Internet Explorer 中重叠

Question

我已经制作了 HTML 页面。该页面在 Google Chrome 和 Firefox 中运行良好，但 Internet Explorer 导致了一些问题。这就是我在 chrome 和 Firefox 中得到的

但在 Internet Explorer 中我得到这个:

这是我的 HTML 和 CSS 代码

    <div class="login">
            <div class="jo-dil clearfix">
                  <div class="hide-on-sm">
                    <h2>GRATIS THUISBEZORGD!</h2>
                  </div>
                    <nav id="primary_nav_wrap">
                        <ul>
                          <li><a href="#"><img src="imgs/euro1.png" /></a>
                            <ul>
                              <li><a href="#"><img src="imgs/euro.png" /></a></li>
                              <li><a href="#"><img src="imgs/euro.png" /></a></li>
                              <li><a href="#"><img src="imgs/euro.png" /></a></li>
                            </ul>
                          </li>
                          <li style="margin-top:-3px;"><a href="#"><img src="imgs/flag1.png" /></a>
                            <ul>
                              <li><a href="#"><img src="imgs/flag.png" /></a></li>
                              <li><a href="#"><img src="imgs/flag.png" /></a></li>
                              <li><a href="#"><img src="imgs/flag.png" /></a></li>
                            </ul>
                          </li>
                        </ul>
                     </nav>        
            </div>

                  <div class="account">
                      <ul>
                        <li><a href="#">INLOGGEN</a></li>
                        <li>|</li>
                        <li><a href="#">REGISTREREN</a></li>
                        <li>|</li>
                        <li><a href="#">MIJN ACCOUNT</a></li>
                      </ul>
                  </div>
      </div>

CSS代码是

    .hide-on-sm img{
          float: left; 
      }
    .jo-dil{
           display: block;
           text-align: right;
           }
           .jo-dil img{
                 float: left;
                 margin-top: 12px;
                 margin-left: 0px;
                 }

           .jo-dil h2{
                 color: #858085;
                 float: left;
                 font-family: "Calibri", sans-serif;
                 font-size: 15px;
                 font-weight: 700;
                 margin-left: 47px;
                 margin-top: 13px;
                 text-transform: uppercase;
            }

Link to web (可能不适合工作。)

请看看并告诉我解决方案。非常感谢任何帮助。

问候，

Answer 1

完成了。我发现我实际上是没有在 IE 中加载的字体。现在它正在加载并且似乎工作正常!谢谢