CSS - разрешить полосу прокрутки, покрытую мозаичными изображениями авторазмера - PullRequest
1 голос
/ 19 января 2012

На этом сайте я нашел отличную помощь, которая помогла мне разместить изображение по обе стороны от моего фиксированного заголовка.Одна из проблем, с которыми я сталкиваюсь - это полоса прокрутки справа, которая закрывается мозаичным изображением и становится недоступной.Я уверен, что это что-то простое, но сейчас я в растерянности.Вы можете посмотреть пример здесь: http://www.jzandecki.com/example

1 Ответ

3 голосов
/ 19 января 2012

Вам нужно будет восстановить заголовок с нуля. Прежде всего создайте div (это будет ваш контейнер заголовков), назовите его id, скажем, «header». Добавьте в качестве фона свое черепичное черное изображение. Позиция этого div должна быть FIXED, а не ABSOLUTE.

position: fixed;
background: url("../images/example_top.jpg") repeat scroll 0 0 transparent;
background-repeat: repeat-x;
height: 178px;
width: 100%;

В ваш заголовок div добавьте еще один div, имеющий ширину, равную ширине вашего изображения электростанции. Установите CSS этого div на margin: auto (чтобы центрировать его на экране).

margin: auto;

Это должно сделать работу. Если это работает, у вас должно получиться то же представление, что и раньше, но полоса прокрутки будет сверху заголовка и не будет скрыта.

Edit:

Кстати, я увидел, что твое тело 900 пикселей и прилипает к левой части экрана. Я рекомендую вам иметь следующий атрибут для вашего тела:

margin: 0;
padding: 0;

Тело должно занимать всю страницу. Если вам нужен блок-обертка размером 900 пикселей для вашего контента, добавьте div ПОСЛЕ вашего div заголовка (описано выше). Этот новый div должен иметь следующие атрибуты css:

width: 900px;
margin: auto; //this centers your div in the middle of your screen
//Other styles that have nothing to do with positioning 

Удачи.

...