стиль noscript не работает

эй, я создаю html-документ, и я хочу, чтобы он был таким, чтобы, когда кто-то посещает страницу и включает noscript, он делал всю страницу черной и отображал белый текст с надписью «включить JavaScript», вот мой код:

<noscript>
<style>
.noscript{
   width: 4000px;
   height: 4000px;
   position: fixed;
   top: 50%;
   left: 60%;
  transform: translate(-50%, -50%);
   background: black;
}
.noscriptext{
width: 400px;
   height: 100px;
   position: fixed;
   top: 40%;
   left: 50%;
  transform: translate(-50%, -50%);
  text-align: center; font-size: 100%;
  color: white;
}

</style>

<div class="noscriptext"><h1>to use this you must enable javascript</h1></div>
</noscript>

<div class="noscript">&nbsp;</div>

но это не работает, помогите пожалуйста? Я пробовал это: Стили тела для тега noscript?, но ничего. изображения: https://imgur.com/a/KRqXS


person adddff    schedule 23.04.2017    source источник


Ответы (1)


У вас есть .noscript после . noscriptext, поэтому оно отображается сверху. Поставьте .noscript перед .noscriptext или используйте z-index на .noscriptext.

Но вы можете немного упростить это, я бы использовал это вместо этого.

<noscript>
<style>
.noscriptext {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: black;
  color: white;
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>
<div class="noscriptext"><h1>to use this you must enable javascript</h1></div>
</noscript>
person Michael Coker    schedule 23.04.2017