#1
1 декабря 2014 в 18:48
Приветствую. Делаю шаблон, в шапке шаблона на фоне стоит картинка, которая занимает всю доступную ширину. Под ней имеется контейнер с шириной 1170пикселей, размер моего окна браузера 1024. Когда загружаю картинку я визуально вижу 1024 пикселей, когда я скроллю в право то картинка установленная на фоне в шапке не отображается дальше 1024 пикселей, происходит обрыв а далее пустота. Почему эта картинка загружается только до окна браузера а не на 1170 пикселей?
#2
1 декабря 2014 в 18:50
container — имеет ширину 1170 пикселей. По идее header оборачивает container и картинка тоже должна так же быть до конца, но нет
#3
1 декабря 2014 в 19:27
Atid — Gorec, а браузер какой?
Сегодня в 03:48
#4
1 декабря 2014 в 19:29
И нет ли каких нибудь ограничений, например, для "wrap", или, предположу о выше идущем "body"?
#5
1 декабря 2014 в 20:07
Ограничений нет, браузер Firefox 33.1
#6
1 декабря 2014 в 20:12
Самое простое, — укажите ширину body
#7
1 декабря 2014 в 21:35
Эта ошибку можно повторить на любом сайте. Выходит так и должно быть. Raiden, IngDesign, спасибо за участие и совет.
#8
2 декабря 2014 в 00:35
Интересно, аж жуть!
А дайте-ка посмотреть…
А дайте-ка посмотреть…
Atid — Gorec, есть вариант адаптировать фоновое изображение с помощью свойства background-size: cover; описание свойства 
ну и для самой картинки задать как-то так:
ну и для самой картинки задать как-то так:
#10
2 декабря 2014 в 08:45
Дело даже не в картинке. html, body wrap, header занимают ширину моего окна браузера, контейнер просто выходит за их рамки, с правой стороны все эти блоки не перекрывают его ((
#11
2 декабря 2014 в 08:53
Контейнер выходит за рамки body? Это как?
#12
2 декабря 2014 в 09:48
По умолчанию body имеет ширину в 100% относительно окна браузера. Все что не помещается — выходит за рамки
Atid — Gorec, всё ж не понятно что именно тебя удивляет?
Ведь любой блок занимает всю доступную ширину родителя, если ему не указанно иное. Если не указанно никому из родителей твоего "header", то он, в конечном итоге будет той же ширины что и body; а его ширина равна ширине окна, если, опять же, не указанно иное.
Самые простые из возможных решений:
— display:table;
— display:inline-block;
— указать ширину явно;
Ведь любой блок занимает всю доступную ширину родителя, если ему не указанно иное. Если не указанно никому из родителей твоего "header", то он, в конечном итоге будет той же ширины что и body; а его ширина равна ширине окна, если, опять же, не указанно иное.
Самые простые из возможных решений:
— display:table;
— display:inline-block;
— указать ширину явно;
#14
3 декабря 2014 в 08:25
Для наглядности картинку загрузил. Серое это контейнер с шириной 1170пикселей а желтое все блоки выше уровнем которые приравниваются к краю окна браузера. По идее желтый блок должен обернуть серый но на деле он выходит за его пределы
#15
3 декабря 2014 в 09:10
Atid — Gorec, зачем нам картинка?) мы уже представили себе визуально вашу проблему, вы код дайте) а ещё лучше ссылку на сайт, хотя бы с проблемным куском кода. Вслепую гадать не комильфо.