Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 16.06.2015, 16:49
Аспирант
Отправить личное сообщение для Dtri Посмотреть профиль Найти все сообщения от Dtri
 
Регистрация: 14.12.2014
Сообщений: 86

Div стремящийся заполнить свободное пространство по вертикали
Здравствуйте. Как сделать блок, который будет заполнять всё доступное пространство по вертикали.

На примере этот блок с классом .center

Суть заключается в том что высота главного блока неизвестна. она "резиновая",
хотелось бы сделать чтобы красный блок с классом .center
заполнял всю доступную высоту которая получается разностью .main_wrapper height - .top height

в примере .main_wrapper задана ширина в пикселях. но это только для наглядности. В реальности .main_wrapper = %, а высота блока .top = px
как вычислить разность в таком случае?


http://jsfiddle.net/Lg7d3Lz8/

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

p.s. Извините что на fiddle выложил.

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

Последний раз редактировалось Dtri, 16.06.2015 в 17:01.
Ответить с цитированием
  #2 (permalink)  
Старый 16.06.2015, 17:37
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,121

Dtri,
так?
http://jsfiddle.net/Lg7d3Lz8/5/
Ответить с цитированием
  #3 (permalink)  
Старый 16.06.2015, 17:44
Аспирант
Отправить личное сообщение для Dtri Посмотреть профиль Найти все сообщения от Dtri
 
Регистрация: 14.12.2014
Сообщений: 86

Сообщение от рони Посмотреть сообщение
Dtri,
так?
http://jsfiddle.net/Lg7d3Lz8/5/
ДА! огромное спасибо! 2 дня ковырялся с этим. А всё оказалось так просто.

Последний раз редактировалось Dtri, 16.06.2015 в 17:47.
Ответить с цитированием
  #4 (permalink)  
Старый 16.06.2015, 17:52
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,121

Dtri,
это обозначает занять всё свободное в пропорции 1 или 100%
если у первого блока поставить 1 блоки разделят высоту на попополам 50 на 50
если поставить 2
200% то первый будет 66% второй 33% занимать

так как первый блок высота фиксированная -- свободное занимает только второй блок -- читайте документацию там больше инфы.
Ответить с цитированием
  #5 (permalink)  
Старый 16.06.2015, 17:59
Аспирант
Отправить личное сообщение для Dtri Посмотреть профиль Найти все сообщения от Dtri
 
Регистрация: 14.12.2014
Сообщений: 86

Сообщение от рони Посмотреть сообщение
Dtri,
это обозначает занять всё свободное в пропорции 1 или 100%
если у первого блока поставить 1 блоки разделят высоту на попополам 50 на 50
если поставить 2
200% то первый будет 66% второй 33% занимать

так как первый блок высота фиксированная -- свободное занимает только второй блок -- читайте документацию там больше инфы.
Ещё раз спасибо. Если не трудно дайте ссылку на хорошую и полную документацию.
Ответить с цитированием
  #6 (permalink)  
Старый 16.06.2015, 18:08
Аспирант
Отправить личное сообщение для Dtri Посмотреть профиль Найти все сообщения от Dtri
 
Регистрация: 14.12.2014
Сообщений: 86

нашёл на w3Scools. Ещё раз спасибо. Отличное свойство (flex)
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
обработчик событий для динамически добавленных элементов Tecvid Events/DOM/Window 28 25.06.2018 13:49
Выровнять DIV по вертикали Гаджи Элементы интерфейса 4 13.01.2015 21:50