Jump to content
  • 0

Background-position:center center; проблема с большим фоном


MageMerlin
 Share

Question

Добрый день.

Помогите пожалуйста. Задача - у меня есть фон 1700 на 1200 и его нужно отобразить на странице так, чтобы центр фона всегда был в центре экрана. Я прописываю

Background-position:center center;
background-image: url('img/bg.png');
background-repeat: no-repeat;

И вместо ожидаемого эффекта наблюдаю, что центральная горизонтальная осевая линия фона является пристугнутой к самому верху страницы (при этом верхняя половина фона обрезана). Что я делаю не так и как правильно сделать?

Разрешения нужны любые, браузер тоже в принципе любой, наблюдается в firefox 3.5.5 проблема.

Картинка с ошибкой http://s45.radikal.ru/i109/0912/a0/a05917aaea0c.jpg 300 килобайт

Там вверху видно беловатое такое пятно - оно должно быть по центру. Красная рамка - это активное место с текстом, не обращайте внимания.

Edited by MageMerlin
Link to comment
Share on other sites

7 answers to this question

Recommended Posts

  • 0

Ну, на 1920 можно и забить, не атк уж часто встречается. Потом над ним думать буду.

Белое пятно отдельно и фон отдельно нельзя, потому что в макете это белое пятно - не отдельный слой, а шейп-эффект, он без самой подложки теряет смысл. Как-то так, короче вырезать именно пятно как ПНГ с эффектом прозрачности не получается. Поэтому принял решение вытаскивать этот огромный полуметровый фон. Потом попробую оптимизировать.

.container имеет фиксированные размеры под 1024 на 768 экран за минусом панелек, на него фон нет смысла вешать - фон должен быть и на 1680*1050. Если же вырезать кусок - не попаду в стык.

Да и тут собственно уже появился спортивный интерес - какого черта не работает то, что работать должно.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy