мой веб — сайт подходит, когда масштаб моего ноутбука составляет 90%, но на 100% переполнен

#css

Вопрос:

Я создаю веб-сайт на своем ноутбуке, просматривая видео инструктора.Я должен установить с ним одинаковые пиксели, чтобы следовать дизайну, который они мне дали. НО дизайн,которому он следует, и я должен это делать, подходит только тогда, когда масштабирование моего браузера составляет 90%. Когда я увеличиваю масштаб на 100%, содержимое переполняется.Элементы отображаются так, как они должны отображаться, когда мой зум составляет 90%. Другими словами, дизайн, которому я должен следовать, не работает на 100%, что, кстати, является значением по умолчанию в моем браузере.Любой другой веб-сайт, который я просто просматриваю в Интернете, работает на 100% идеально. я установил : * поле для тела 0 размеры фона всех разделов покрывают или 100%

если мне нужно уточнить более подробную информацию, пожалуйста, было бы полезно сообщить мне об этом заранее.

 body{
    margin: 0;
    font-family: "SourceSansPro", serif;
}


@media (min-width: 1280px) {
    .container {
    width: 1360px;
   
}

header {
    height: 745px;
    padding-bottom: 90px; 
}
 
 <html>
<head>
    <link href="app2.css" rel="stylesheet" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
    <body>
        <header>
            
            <div class="container">
 

Комментарии:

1. Покажите нам соответствующий HTML CSS, пожалуйста

2. Возможно, также уменьшить заполнение кузова до 0

3. Вы установили ширину 1360 пикселей, даже если ширина устройства меньше этой (до 1200 пикселей). Это то, откуда исходит ваше переполнение?

4. Хаворт , у меня было 1240 пикселей.Но с самого начала, даже без этого @media..,просто редактирование только для рабочего стола не работает должным образом. Согласно дизайну, он должен быть 1360 пикселей. На 90% работает идеально.

5. вы пробовали увеличить масштаб вашего браузера на 100%, а затем обновить страницу?

Ответ №1:

Я заметил здесь ошибку в закрывающих скобках:

 @media (min-width: 1280px) {
    .container {
        width: 1360px; /* Why you set 1360px when min-width is 1280px? */
    } /* Need to close this */
}
 

Чтобы узнать, как решить эту проблему, было бы целесообразно опубликовать html и css страницы. Было бы лучше, если бы вы также опубликовали скриншот, чтобы мы лучше поняли, что происходит.

Комментарии:

1. я не могу загрузить свои скриншоты, потому что я новичок на этом сайте. я постараюсь уточнить получше. спасибо вам за ваши ответы до сих пор.