css - относительный DIV не имеет высоты

Я не понимаю, что случилось с моим кодом. Я имею в виду, что элемент секции имеет высоту, отображаемое значение моего элемента DIV является определенным блоком, и я действительно не знаю, как это работает и как объединить эти два элемента по-разному. Пожалуйста, дайте мне ваши решения и советы, чтобы узнать что-то новое сегодня.css - относительный DIV не имеет высоты

div { 
 
    position: relative; 
 
    margin: 0 30%; 
 
} 
 

 
div section { 
 
    position: absolute; 
 
    top: 0; 
 
    right: 0; 
 
    left: 0; 
 
    height: 100px; 
 
    background-color: yellow; 
 
} 
 

 
hr { 
 
    height: 2px; 
 
    background-color: blue; 
 
}

<div> 
 
    <section></section> 
 
</div> 
 

 
<hr>

источник

2016-10-16 Anonymous

Каков ваш окончательный результат? – Cristian

Что именно представляет собой проблема и что вы хотите увидеть в результате? – Olga

Мне нужна высота для моего элемента div –

Вы хотите, чтобы ваш час на нижней части первого DIV, верно?

Однако это не работает, потому что родительский div имеет свойство height: auto по умолчанию.
Это означает, что родительский div будет иметь высоту своих детей.
Когда вы устанавливаете position: absolute на ребенка, вы нарушаете эту систему.
Родитель больше не будет заботиться о своем ребенке.

Итак, если вы хотите сделать это работает, у вас есть дварешение:
- установить пользовательскую высоту (height: 100px) на родительском DIV (не хорошо)
- удалить абсолютное положение на участке ребенка (по умолчанию: position: relative)

div { 
 
    position: relative; 
 
    margin: 0 30%; 
 
} 
 

 
div section { 
 
    height: 100px; 
 
    background-color: yellow; 
 
} 
 

 
hr { 
 
    height: 2px; 
 
    background-color: blue; 
 
}

<div> 
 
    <section></section> 
 
</div> 
 

 
<hr>

источник

2016-10-16 08:59:44 C0ZEN

приятное исчисление (y) спасибо –

Добро пожаловать. – C0ZEN

Ваш элемент имеет высоту установлен в положение AUTO. Если вы хотите изменить высоту div, вам нужно написать это в css.

div { 
    position: relative; 
    margin: 0 30%; 
    height: 200px; 
    background-color: red; 
}

источник

2016-10-16 08:45:02

Я думаю, это потому, что ваш div не имеет сам не высоты, поэтому она не видна, и она увеличивается в соответствии с его дочерним элементом, который section и находится в absoulute положения. Я не уверен, что вы делаете, но если вы хотите показать раздел внутри div вместе с высотой div, вы должны включить css для своего div.

я предоставил решение допущения для вас надеюсь, это поможет вам

div { 
 
    position: relative; 
 
    margin: 0 30%; 
 
    background-color: green; 
 
    height: 150px; 
 
} 
 
section { 
 
    position: absolute; 
 
    top: 50px; 
 
    right: 0; 
 
    left: 0; 
 
    height: 50px; 
 
    background-color: yellow; 
 
} 
 
div hr { 
 
    height: 10px; 
 
    background-color: red; 
 
}

<html> 
 
<head> 
 
</head> 
 
<body> 
 
    <div> 
 
    <p>your div</p> 
 
    <hr> 
 
    <section>your section</section> 
 
    </div> 
 
</body> 
 

 
</html>

источник

2016-10-16 08:57:45

css - относительный DIV не имеет высоты

ответ

Смежные вопросы