Internet Explorer - 仅在刷新后应用CSS样式

时间:2016-04-09 12:55:11

标签: css asp.net-mvc internet-explorer

我是网络开发的新手。我遇到了一个仅存在于Internet Explorer中的问题 - 主菜单的CSS样式在刷新后应用(仅F5,而不是CTRL-F5)。我使用MVC .NET来制作网站的后端。我不知道如何解决这个问题。

出现此问题的网站是:

http://jakubkowalczykart.com/

提前谢谢。

@Edit:Cope片段再现问题。在Chrome或Firefox中打开它看起来不错,但在IE中却没有

风格:

.main_menu {
    min-height: 40px;
    z-index: 10;
    height: 8vh;
    position: fixed;
    top: 0;
    width: 100%;
    opacity: 0.90;
    background: black; 
}
.menu_image {
    height:100%;
}
.menu_list {
    margin: 0 auto;
    height: 70%;
    list-style-type: none;
    overflow: hidden;
}


.menu_container {
    display: flex;
    align-items: center;
    height: 100%;
}
.menu_list {
    margin-right: 3vw ;
    height: 70%;
    list-style-type: none;
    overflow: hidden;
}

.menu_list li {

    height: 100%;
    float: left;
}

Html:

<html>
<head>
</head>
<body id="body">

    <div class="main_menu" id="main_menu">
        <div class="logo">
            <div id="logo_img" ></div>
        </div>

            <div class="menu_container">
            <ul class="menu_list">
                <li>
                    <a href="#">
                        <img id="first_menu" class="menu_image" src="http://jakubkowalczykart.com/Content/Images/smallportfoliobutton.png" />
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img  id="second_menu" class="menu_image" src="http://jakubkowalczykart.com/Content/Images/smallshopbutton.png" />
                    </a>
                </li>

                <li>
                    <a href="#">
                        <img id="third_menu" class="menu_image" src="http://jakubkowalczykart.com/Content/Images/smallaboutbutton.png" />
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img id="fourth_menu" class="menu_image" src="http://jakubkowalczykart.com/Content/Images/smallcontactbutton.png" />
                    </a>
                </li>

            </ul>
            </div>

    <div class="main_container" id="main_container">
    </div>

    <div class="footer">
    </div>
</body>

</html>

0 个答案:

没有答案