Форум программистов, компьютерный форум, киберфорум
Наши страницы

HTML, CSS

Войти
Регистрация
Восстановить пароль
 
 
Рейтинг: Рейтинг темы: голосов - 19, средняя оценка - 4.84
Randow
0 / 0 / 1
Регистрация: 27.01.2014
Сообщений: 49
#1

Растянуть бэкграунд по высоте - HTML, CSS

16.07.2014, 14:21. Просмотров 3086. Ответов 20
Метки нет (Все метки)

Здравствуйте, форумчане!

Не кидайтесь помидорками, пожалуйста, я знаю, что эта тема - давний баян, но я нашла несостыковку.
Значится, в чем вопрос: Дано у меня body, у которого бэкграунд - картинка. Тан у меня внутренний div, у которого бэкграунд - градиент. У меня изначально был косяк - картинка шла по всему пространству экрана, а градиент захватывал только содержимое. Мне же его нужно на ту же область растянуть, что и body. В чем я нашла решение:
html, body {height: 100%;}
И все работает! Но.
Если я увеличиваю масштаб до появления полосы прокрутки (проверяю с позиции юзверя со зрением в -over9000 или просто владельцев мониторов с разрешением 800х600 ), то бэкграунд дива (тот, что градиент) распространяется только на... скажем так, один экран. Т.е. прокрутил ниже - а там только картинка, без градиента.
Как справиться с этим?
Заранее спасибо.

Добавлено через 1 минуту
Кстати, если масштаб страницы наоборот уменьшаю, то все растягивается, как и положено.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
16.07.2014, 14:21
Здравствуйте! Я подобрал для вас темы с ответами на вопрос Растянуть бэкграунд по высоте (HTML, CSS):

Как растянуть бэкграунд для всех браузеров на весь экран? - HTML, CSS
Товарищи, добрый день. Знаю я мало, но вот пытаюсь украсить свой сайт. Сделал его в юкозе, но хочу чтобы первая страничка была...

Как растянуть li по высоте - HTML, CSS
Может кто подскажет, столкнулся я с такой такой задачей. Есть блок ul в нем находиться порядка 4-5 li Во втором блоке находится текст и...

Растянуть div на 100% по высоте - HTML, CSS
Похожие темы на форуме вроде есть, но ответа так и не нашел. Такая ситуация div внутри div'a, первый div на всю высоту идет, а...

Растянуть картинку по высоте body - HTML, CSS
Всем привет, есть такая проблема, есть картинка, я ее растягиваю в блоке повторением до определенного размера, как сделать чтобы она...

Растянуть див по высоте содержимого - HTML, CSS
Доброе время суток! Помогите пожалуйста есть разметка. Три дива вложены один в другой <div class="top_wrapper"> <div...

как растянуть картинку по высоте - HTML, CSS
Ребята такая проблема я хочу сделать фоном картинку. но выходит что в моём случае берутся картинка и внизу начинает накладываться ещё одна,...

20
Randow
0 / 0 / 1
Регистрация: 27.01.2014
Сообщений: 49
16.07.2014, 16:56  [ТС] #16
Цитата Сообщение от _Я_ Посмотреть сообщение
height: 414px; - убери
Спасибо, логика проявилась, но в таком случае у меня вопрос появился (голова уже не варит), почему пришолсь убирать фиксированную величину блока меню? Таким образом произошло растягивание под контент, да, но тень контентом не считается... Фикс. высота дива под меню могла добавить пространства... Логично ведь, нет?

Добавлено через 1 минуту
Цитата Сообщение от vovandr Посмотреть сообщение
Не правда у меня 2550 ... mac 27 и ничего не выплывает
С одной стороны это круто, ибо самый сок на таком работать но вдруг вот такие косяки появятся?..
0
vovandr
628 / 516 / 139
Регистрация: 19.08.2013
Сообщений: 1,401
16.07.2014, 16:58 #17
К #main добавь padding нижний на высоту тени и все. Вообще верстка у вас полное г...Извините конечно
0
_Я_
16 / 16 / 11
Регистрация: 10.07.2014
Сообщений: 84
16.07.2014, 17:00 #18
Цитата Сообщение от Randow Посмотреть сообщение
Фикс. высота дива под меню могла добавить пространства
он и так добавляет, так как в нем есть другие дивы которые тянут его по высоте
добавь этот кусочек чтобы shadow не обрезался
CSS
1
2
3
#main {
padding-bottom: 10px;
}
Добавлено через 1 минуту
Цитата Сообщение от vovandr Посмотреть сообщение
Вообще верстка у вас полное
да можно сделать намного проще
0
Randow
0 / 0 / 1
Регистрация: 27.01.2014
Сообщений: 49
16.07.2014, 17:04  [ТС] #19
Цитата Сообщение от vovandr Посмотреть сообщение
Вообще верстка у вас полное г...
Цитата Сообщение от _Я_ Посмотреть сообщение
да можно сделать намного проще
Простите, чайник еще
А проще - это как?
0
_Я_
16 / 16 / 11
Регистрация: 10.07.2014
Сообщений: 84
16.07.2014, 17:10 #20
Цитата Сообщение от Randow Посмотреть сообщение
А проще - это как?
так сразу сказать не могу, так как не видел макет страницы (или что другое), но стили можно более адаптированные сделать
Да и добавь
CSS
1
2
3
#main {
box-sizing: border-box;
}
0
Randow
0 / 0 / 1
Регистрация: 27.01.2014
Сообщений: 49
16.07.2014, 17:18  [ТС] #21
Цитата Сообщение от _Я_ Посмотреть сообщение
Да и добавь
Спасибо, добавила

Да, стили у меня прописаны сейчас слишком примитивно, т.к. я и сама не научилась мыслить более масштабно, но это со временем пройдет/уберется)) я надеюсь

спасибо обоим за помощь! Очень помогли и направили в правильное русло
0
16.07.2014, 17:18
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
16.07.2014, 17:18
Привет! Вот еще темы с ответами:

Растянуть блок по всей высоте - HTML, CSS
Здравствуйте! Есть html код <!DOCTYPE HTML> <html> <head> <title>Малакден</title> <meta charset="utf-8"> ...

Как растянуть div по высоте родителя - HTML, CSS
Здравствуйте. Мне нужно растянуть блок с контентом на сто процентов, на примере видно для чего это мне нужно _bio-logiya.ru Пробовал...

Растянуть по высоте (резиновая высота div) - HTML, CSS
Есть конструкция страницы - см. рисунок. Верстка блочная. Необходимо чтоб нижняя граница CONTENT прилипала к футеру. Некая резиновая...

Растянуть блок по высоте на 100% в пределах контейнера - HTML, CSS
Здравствуйте Имеются у нас контейнер и дочерный блок: <div id='container'> // контейнер <div id='b1'></div> // дочерний </div> ...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
21
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Рейтинг@Mail.ru