Что это значит, когда размеры элементов "auto x auto"?

Question

В моем приложении Angular я использую Bootstrap, и некоторые элементы генерируются каркасом Bootstrap. Я заметил, что многие из этих элементов имеют размеры auto x auto, и это, кажется, влияет на поведение элементов под ним (например, когда я устанавливаю высоту 100%, она не заполняет всю высоту родительского элемента, как я бы ожидайте)

Так что же такое auto x auto, как оно устанавливается и какой именно эффект он оказывает на остальную часть страницы?

Answer 1

Это означает, что элемент не имеет ширину и высоту, установленные в css. Для блочного элемента это означает, что у него будет ширина родительского элемента и высота, определяемая его содержимым, для встроенного элемента - его размеры будут определяться его содержимым.

Вы не можете установить height:100%, поскольку родительский элемент также не имеет установленной высоты.

Вы сможете установить height:100%, если родительский элемент имеет некоторую явную высоту или если его позиция равна absolute.