Почему мой ul CSS работает в IE, а не в Chrome? - PullRequest
Новая
       8

Почему мой ul CSS работает в IE, а не в Chrome?

0 голосов
/ 27 ноября 2018

Как гласит заголовок;похоже, это нормально работает в Internet Explorer, но не в Chrome (форматирование не отображается в Chrome, а просто, как будто CSS не применяется).Я не уверен, почему, как мне кажется, работает нормально, если я поместил CSS внутри тега head прямо в HTML (однако он мне нужен в CSS по другим причинам).

Любая помощь будет оценена :)

Это фрагмент моего HTML: 

<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
 <link rel="stylesheet" type="text/css" href="newcss.css">
</head>
<body>

<ul class="sidenav">
  <li><a class="active" href="#home">Home</a></li>
  <li><a href="#news">News</a></li>
  <li><a href="#contact">Contact</a></li>
  <li><a href="#about">About</a></li>
</ul>

Это фрагмент моего CSS: 

ul.sidenav {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 25%;
    background-color: #f1f1f1;
    position: fixed;
    height: 100%;
    overflow: auto;
}

ul.sidenav li a {
    display: block;
    color: #000;
    padding: 8px 16px;
    text-decoration: none;
}

ul.sidenav li a.active {
    background-color: #4CAF50;
    color: white;
}

ul.sidenav li a:hover:not(.active) {
    background-color: #555;
    color: white;
}

div.content {
    margin-left: 25%;
    padding: 1px 16px;
    height: 1000px;
}

@media screen and (max-width: 900px) {
    ul.sidenav {
        width: 100%;
        height: auto;
        position: relative;
    }
    ul.sidenav li a {
        float: left;
        padding: 15px;
    }
    div.content {margin-left: 0;}
}

@media screen and (max-width: 400px) {
    ul.sidenav li a {
        text-align: center;
        float: none;
        }
    }

1 Ответ

0 голосов
/ 27 ноября 2018

Так что не уверен, почему это происходит, но я удалил, а затем переустановил Chrome, и это сработало?

Ну хорошо

...