Не удается получить 100% высоту раздела

#html #css

#HTML #css

Вопрос:

Вот мой jsfiddle:

http://jsfiddle.net/KfjGU/425/

Код довольно прост:

     <main>
        <section class="parallax">

        </section>



        <section class="content">
            <h1>Center</h1>      
        </section>
    </main>
  

и в css установите

  html, body { min-height: 100%; }
  

и то же самое с разделом с определенным классом parallax:

  .parallax { height: 100%; }
  

Был бы признателен за любую помощь здесь.

С уважением,

Джордж

Ответ №1:

Попробуйте установить main на 100% . Если вы не установите для него значение 100% , так и будет 0% , поскольку он не знает, на что его установить.

 html, body, main, .parallax {
    height: 100% !important;
    height: 100%;
}
  

Вот демо

Комментарии:

1. Как он и сказал. То, что вы делаете в своем коде LoveAndHappiness, заключается в том, что вы устанавливаете высоту 100% В теге «main», а поскольку основной тег не составляет 100% веб-сайта, div в нем не может расширяться по высоте main. Сначала установите для main значение 100%, чтобы оно доходило до самого низа, а затем вы можете установить для вашего раздела значение 100%. Хороший ответ, Идрис.

2. Подробное и сжатое объяснение. Неплохо. @LittleB0Y

3. Спасибо, отредактировал, чтобы было больше смысла, лол. Хороший пример выше. Точка для u .

4. вы также могли бы работать с height: inherit . Конечно, результат будет таким же, просто зависит от того, как вы пишете свой CSS

Ответ №2:

Вы должны установить main высоту 100%, потому что это новый тег, который вы создаете, и поэтому у него нет свойств. Таким образом, .parralax будет 100% неопределенной высоты, следовательно, ничего не работает.