Проблема форматирования при попытке использовать файлы Png для фоновой оболочки - PullRequest
0 голосов
/ 22 марта 2012

Надеюсь, кто-то может мне помочь, так как я все еще довольно новичок во всем, что касается веб-дизайна. Я использую CSS для создания оболочки контейнера. Как вы можете видеть из кода, у меня есть нижнее, верхнее и центральное изображение. Когда я использовал изображения JPEG, все выстроилось правильно, однако мне нужно было переключиться на файлы изображений PNG (чтобы воспользоваться прозрачностью), и теперь верхняя и нижняя части обертки смещены.

** Вот прямая ссылка: storrepictures.weebly.com/projects.html

-Пожалуйста, найдите изображение возникшей проблемы здесь: http://i.imgur.com/YnTS8.png
Вот как это выглядит, когда я использую JPEG вместо PNG: http://i.imgur.com/2WMFN.png

Вот мой код CSS:

#wrapper {
    background: url(containerbg.png) center repeat-y;
    }

#wrappertop{
    background: url(containertop.png) top center no-repeat;
}

#wrappertbtm{
    background: url(containerbtm.png) bottom center no-repeat;
    padding-bottom: 65px;
}

А вот часть тела HTML-файла:

<div id="wrapper">
    <div id="wrappertop">
        <div id="wrappertbtm">
        <div id="container">

        <div id="header">
            <div id="headerleft">{logo max-height="60"}</div>
            <div id="navigation">{menu}</div>        
        </div>      

        <div id="content">{content}
            <div id="footer">{footer}

            </div>
            </div>
            </div>
            </div>
            </div>
</div> 
</div>

Ответы [ 2 ]

1 голос
/ 22 марта 2012

проверить высоту добавить ширину JPEG и PNG .. могут быть разные.Я не уверен, но я думаю, что вы можете решить вашу проблему, задав им одинаковую высоту и ширину.

0 голосов
/ 22 марта 2012

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

И если вы дадите нам живую демонстрациючем мы могли бы глубоко увидеть точные ошибки ..

...