Nano Hash - криптовалюты, майнинг, программирование

Держите фоновое изображение по центру при изменении размера окна браузера

Итак, я делаю макет для форума SMF, и фоновое изображение идеально центрируется, когда окно браузера достаточно широкое. Однако, когда я начинаю сжимать окно браузера, фоновое изображение начинает двигаться влево. Вот мой текущий CSS для фона:

body
{
    background: #fefff1 url(../images/img/bg.gif) no-repeat;
    background-position:top center;
    margin: 0 auto; 
    color: #7C3C4A;
    padding: 0px 5%;
    font: 78%/130% "Verdana", "Arial", "Helvetica", sans-serif;
}

Вот скриншот форумов, чтобы вы могли лучше его представить:

http://i.imgur.com/49pRI.png

browser css background center resize
06.03.2012

Ответы:


1

Ваш код кажется правильным.

Единственное, что я сделал, это объединил background-position с одним и тем же фоновым атрибутом вверху, например так:

body {
    background: #fefff1 url(../images/img/bg.gif) no-repeat top center;
    margin: 0 auto; 
    color: #7C3C4A;
    padding: 0px 5%;
    font: 78%/130% "Verdana", "Arial", "Helvetica", sans-serif;
}

Вот JFiddle: JFiddle Link

06.03.2012
  • О, хорошо. Однако проблема все еще существует. 06.03.2012

    • 2
  • Не совсем то, что я имел в виду. Я добавил скриншот в первый пост для справки. 06.03.2012
  • Не могли бы вы дать мне настоящую ссылку, чтобы я мог посмотреть. В основном фоновые изображения не должны уменьшаться. 06.03.2012
  • Вам нужно будет войти, чтобы увидеть его. Имя пользователя = тестовая учетная запись | Пароль = 123456 06.03.2012
  • Проблема не в фоновом изображении. Вам нужно установить отступ вашего тела на 0. Сейчас это 5% сбоку. Прокладка толкает ваше тело вправо, и вы думаете, что фоновое изображение сжимается. 06.03.2012
    • Новые материалы
    Кластеризация: более глубокий взгляд
    Кластеризация — это метод обучения без учителя, в котором мы пытаемся найти группы в наборе данных на основе некоторых известных или неизвестных свойств, которые могут существовать. Независимо от..
    Как написать эффективное резюме
    Предложения по дизайну и макету, чтобы представить себя профессионально Вам не позвонили на собеседование после того, как вы несколько раз подали заявку на работу своей мечты? У вас может..
    Частный метод Python: улучшение инкапсуляции и безопасности
    Введение Python — универсальный и мощный язык программирования, известный своей простотой и удобством использования. Одной из ключевых особенностей, отличающих Python от других языков, является..
    Как я автоматизирую тестирование с помощью Jest
    Шутка для победы, когда дело касается автоматизации тестирования Одной очень важной частью разработки программного обеспечения является автоматизация тестирования, поскольку она создает..
    Работа с векторными символическими архитектурами, часть 4 (искусственный интеллект)
    Hyperseed: неконтролируемое обучение с векторными символическими архитектурами (arXiv) Автор: Евгений Осипов , Сачин Кахавала , Диланта Хапутантри , Тимал Кемпития , Дасвин Де Сильва ,..
    Понимание расстояния Вассерштейна: мощная метрика в машинном обучении
    В обширной области машинного обучения часто возникает необходимость сравнивать и измерять различия между распределениями вероятностей. Традиционные метрики расстояния, такие как евклидово..
    Обеспечение масштабируемости LLM: облачный анализ с помощью AWS Fargate и Copilot
    В динамичной области искусственного интеллекта все большее распространение получают модели больших языков (LLM). Они жизненно важны для различных приложений, таких как интеллектуальные..