Макет сайта отличается только в браузере Chrome - PullRequest
0 голосов
/ 22 мая 2019

enter image description here

Я добавил простое раскрывающееся объявление на мой сайт, которое будет показано через X секунд, макет сайта такой же, как и раньше.

На каждом устройстве, которое я проверял, все работает отлично, кроме моего собственного :) в chrome, макет все грязный, как вы видите на картинке выше, но в другом браузере все в порядке.

Вы можете увидеть сайт здесь: https://www.start -2-code.com /

Я добавил все необходимые префиксы для Chrome, а такжедважды проверил сайт, используя Chrome на разных устройствах, но я не могу найти проблему

 <div class = "image_pop">
            <div class="image_pop_up" >
            <a href="#main__content" class="image_pop_up_close">&times;</a>
            <a href="https://click.linksynergy.com/fs-bin/click?id=ZmWG8YDQO/4&offerid=507388.4670&subid=0&type=4">
                <img 
                    class = "image_pop_up_image"
                    alt="The Official Alibaba Course for only $10.99." 
                    src="https://mproxy.banner.linksynergy.com/fs/banners/39197/39197_1622.png">
            </a>
            </div>  
        </div>

CSS-код

.image_pop {
  height: 100vh;
  width: 100%;
  position: fixed;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 10;
  -webkit-transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
  transition: all .3s ease-out;
  opacity: 0;
  visibility: hidden;
  margin: 0 auto; }

  .image_pop_up {
    width: 50vw;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    -webkit-box-shadow: 0 -2rem 6rem rgba(0, 0, 0, 0.8);
            box-shadow: 0 -2rem 6rem rgba(0, 0, 0, 0.8); }
    @media only screen and (max-width: 31.25em) {
      .image_pop_up {
        width: 70vw; } }

    .image_pop_up_close {
      color: black;
      text-decoration: none;
      line-height: 1;
      font-size: 4rem;
      position: absolute;
      top: .5rem;
      left: 1rem; }

    .image_pop_up_image {
      max-width: 100%;
      max-height: 100%; }

Я предполагаю, что у нас установлена ​​другая версия Chromeразные устройства, так вот в чем причина проблемы?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...