Окно просмотра не масштабируется по центру - PullRequest
Новая
       42

Окно просмотра не масштабируется по центру

0 голосов
/ 31 августа 2018

Я использую это на сайте 

    <meta name="viewport" content="width=200px, initial-scale=0.5, user-scalable=no">

В моем файле CSS у меня есть это для перемещения некоторых элементов 

@media screen and (max-width: 767px) {
    #wb_element_instance3{display: none}
    #wb_element_instance11 {left: 280px}
    #wb_element_instance12 {left: 570px}
    #wb_element_instance13 {left: 655px}
    #wb_element_instance14 {left: 705px}
}

А теперь моя проблема. Когда я захожу на свой веб-сайт с помощью телефона, материал в «@media» работает нормально, но область просмотра немного смещается относительно центра сайта.

Итак, есть ли способ как-то отцентрировать его?

Большое спасибо!

1 Ответ

0 голосов
/ 01 сентября 2018

Вы дали очень мало информации, чтобы помочь решить проблему, но применяются некоторые общие указатели. 1) Абсолютное позиционирование (с использованием верхних / левых и т. Д.) Не очень хорошая идея, особенно если вы кодируете с целью центрирования на устройствах разных размеров.

2) Вы можете лучше обслуживать устройства разных размеров, добавляя другие медиа-запросы. например @media only screen and (min-width:480px) and (max-width:640px){ } или 

 @media only screen and (max-width:480px){/*your css here*/}

и т.д..

Центрирование обычно выполняется с помощью свойства margin или выравнивания текста. Имейте в виду, что некоторые CSS могут влиять на другие свойства CSS. Если вы центрируете изображение, присвойте ему ширину (в процентах), а затем вы можете использовать margin: 0 auto или margin-left: auto; и поле справа: авто;

Пример центрирования по тексту: 

.wb_example{
  text-align:center;
}
<body>
  <p class="wb_example">Hello</p>
</body>
...