2013-12-16 5 views
1

У меня проблема с селектором body. Когда я уменьшаю свои окна, он не сохраняет ширину тела на 100%, и я не знаю, почему.Ширина тела 100% вопрос

body 
{ 
    margin:0px !important; 
    background:url(../images/bg.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    width:100%; 
    height:100%; 
} 

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

Я не могу добавить фото, чтобы показать, потому что у меня нет 10 репы, но вы можете проверить по этой ссылке и сделать окна меньше: http://websoftit.ro/lackoflove/about.php?active=1

я не хочу, чтобы мой сайт, чтобы быть отзывчивым я просто хочу, чтобы мое тело было на 100% на любом разрешении. вот ссылки на фотографии и проблемы, которые я имею, когда я делаю окно меньше: i.imgur.com/70sj43G.png i.imgur.com/OgMZVxa.png

+0

Опубликовать фото для imgur и поделится URL-адресом – Zword

ответ

2

У вас есть ширина, установленная внутри тела. Например, ваша навигация имеет ширину 1060 пикселей, как и ваш основной_басс.

0

Детские диваны не имеют ширины для жидкости. Если вы измените ширину «CSS» на «max-width», вы получите возможность увидеть, как макет изменяется с разной шириной экрана. Там обязательно будут дополнительные обновления, необходимые для вашего CSS, но это поможет вам начать работу.

1

Проблема на самом деле вызваны div#banner, которая имеет следующий стиль:

#banner { 
    position: absolute; 
    width: 150px; 
    margin-top: 5px; 
    margin-left: 1040px; 
} 

Margin набор для 1040px вместе с width: 150px вызывает ваш баннер, чтобы иметь общую ширину 1190px, что шире, чем остальная часть сайта ,
Я предполагаю, что вы использовали position: absolute на своем баннере, чтобы избежать этой проблемы, но этого недостаточно, чтобы заставить его работать так, как вы хотите.
Вы можете узнать больше о решении этой проблемы here.

Примечание: выше решает вашу проблему, но не поможет сделать ваш сайт отзывчивым.
Если отзывчивый дизайн - ваша цель (вы не сказали этого, я просто догадываюсь, что, возможно, это так), я бы рекомендовал посмотреть некоторые уроки, чтобы получить основные правила и т. Д.
Там также есть отзывчивый такие как Bootstrap или Zurb Foundation, которые помогают создавать отзывчивые веб-сайты.

+0

Я не хочу, чтобы мой сайт был отзывчивым, я просто хочу, чтобы мое тело было на 100% на любом разрешении. вот ссылки на фотографии и проблемы, которые я имею, когда я делаю окно меньше: http://i.imgur.com/70sj43G.png http://i.imgur.com/OgMZVxa.png – user3058067

+0

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

0
document.onresize = function() { 
    document.body.style.width = document.body.scrollWidth+"px"; 
} 

Это может помочь вам при изменении размера документа, эта обратная связь сбрасывает ширину корпуса до 100% ширины документа.

Смежные вопросы