Как в css блок div сделать резиновым?

Question

[Djahar]

Подскажите, как сделать блок div резиновым, чтобы при уменьшений экрана блок div не отрывался от подвала?
Я начинающий, верстать только учусь.По этому приемов знаю не особо много. Смог прижать подвал к низу. Но теперь резиновый только основной блок, а те divы, которых в нем нет, все отрываются от подвала при уменьшении экрана.

Надеюсь, понятно задал вопрос.

Спасибо за уделенное внимание!

Comments

[Krickt]

jsfiddle.net

[Евгений Низамиев]

Киньте ссылку на сайт, или сам код(только html + css) чтоб было понятно что уже сделали

[Ольга Стогова]

если я правильно вас поняла, вы теперь прижали футер, у вас растягивается wrapper, но блоки внутри wrapper остаются вверху и не растягиваются на всю длину при уменьшении масштаба и вы хотите чтобы они тоже тянулись?

Если все так, то они и не должны тянуться, суть метода прижатого подвала именно в прижатии подвала и растягивании wrapper, и все. done.

[Djahar]

@dessert вы правильно поняли.Я пробовал задавать блокам внутри wrapper height 100% но он не растягивается, у всех родителей тоже 100%.
Почему не применяется к нему?

[Ольга Стогова]

@Djahar а можно посмотреть живой пример? Мой достаточно большой опыт верстки всяких извращений ни разу мне не подкинул макет, в котором при ресайзе страницы с стандартной структурой wrapper, footer и пр., была хоть одна причина растягивать детей враппера на всю высоту страницы и я полностью уверена, что вы зря тратите на это время)

[Djahar]

@dessert думаете зря?)Короче верстка не удалась, буду искать другие варианты

[Djahar]

@dessert просто верстаю что бы была практика и остановился на этом моменте)

[Ольга Стогова]

@Djahar ну я думаю, что высоту элемента нужно практиковать на других вещах – ну сделать двухколоночник с одинаковой высотой колонок, например)

[Djahar]

@dessert ну это я так понял получится только в фиксированной верстке?

[Djahar]

@dessert простите за тысячу вопросов

[Ольга Стогова]

@Djahar нет, не только, попробуйте, там есть как минимум три варианта, один чисто на html, второй с css, третий с js, ничего задавайте, лучше вовремя задать вопрос, чем не задать)

[Djahar]

@dessert jsfiddle.net/7yuhh вот я по новой все сделал, только не прижал еще футер, объясните пожалуйста теперь как его правильно прижать что бы sidebarЫ и content растягивались при ресайзе. Спасибо!

[Djahar]

@dessert то есть что бы в длину растягивались, ну вы поняли в общем))

[Ольга Стогова]

@Djahar jsfiddle.net/helgastogova/Pz74K/1
1. меньше id, больше class
2. footer не в wrapper
3. ну я б сделала так

Answer 1

[Юрий Лобанов]

Гуглите "Как прижать footer к низу страницы"
www.xiper.net/collect/html-and-css-tricks/karkas-v...
например.

Answer 2

[Алексей Кулешов]

div {
  style: rubber;
}

Answer 3

[Djahar]

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

Comments

[Юрий Лобанов]

Это Вы внимательно посмотрите по ссылке. То, что Вы сделали что-то через жопу - не говорит о том, что через жопу надо делать остальное. Попробуйте сделать так, как делают люди, которые не начинающие.
Это во-первых, во-вторых - приложите код своего творения. Без кода можно только гадать, кто Вас знает - как Вы там футер прижали.

[Алексей Кулешов]

to @iiil к сердцу он его прижал и не пущает)))

@Djahar мой ответ вряд ли Вам поможет))) Ищите примеры того что Вам надо и изучайте как это сделано, желательно на серьезных сайтах.

[Djahar]

@iiil попрошу помягче выражаться. www.zakharov.ms/footer этим способом я прижимал футер.

[Юрий Лобанов]

@Djahar киньте код, который получили. Лучше, если оформите на codepen.io или на jsfiddle.net. Укажите, что хотите.
Потому что если Вы делали так, как по ссылке (это тот же способ, что кинул я), то все дивы у Вас должны быть внутри page-wrapper.

[Djahar]

@iiil у меня и так все дивы в нем, точнее в диве main

[Юрий Лобанов]

@Djahar ок, давайте код. Опишите, от каких блоков и чего хотите.

[Djahar]

@iiil jsfiddle.net./gEY8b я тут как бы только каркас скинул , а стили других объектов не посчитал нужным вбивать, они бы только мешали вам разобраться.

[Алексей Кулешов]

Я не понимаю в чем проблема - все и так резиновое?!?!?!?

[Djahar]

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

[Djahar]

Возможно вопрос надо было поставить так изначально : как сделать что бы блок не изменял высоту относительно контента внутри него?

[Алексей Кулешов]

@Djahar Вас очень сложно понять. Читайте книжки/интернет - изучайте основы верстки и CSS, смотрите конкретные примеры!

Answer 4

[Ольга Стогова]

если вы его прижали этим способом
www.xiper.net/collect/html-and-css-tricks/karkas-v...

но высота футера не фиксирована, все просто

не ставьте высоту, а margin задавайте js
$('.footer').css('margin-top',$(this).height());

так же у блока, hFooter можно задать высоту через js

$('.hFooter').css('height',$('.footer').height() + 20);

например