Css reset min height

CSS свойство min-height

Свойство min-height устанавливает минимальную высоту элемента. Оно не допускает, чтобы значение свойства height стало меньше, чем значение, указанное для min-height .

Min-height отменяет использование свойств height и max-height.

Свойство устанавливается в единицах измерения длины CSS (px, pt, em и т. д.) или в процентах.

Значение по умолчанию	none
Применяется	Ко всем элементам, кроме незаменяемых строчных элементов, колонок таблицы, групп колонок.
Наследуется	Нет
Анимируемое	Да. Высота анимируема.
Версия	CSS2
DOM синтаксис	object.style.minHeight = «100px»;

Синтаксис

min-height: length | initial | inherit;

Пример

html> html> head> title>Заголовок документа title> style> div < min-height: 50px; background-color: #8ebf42; > style> head> body> h2>Пример свойства min-height h2> div>Минимальная высота текстовой области равна 50px. div> body> html>

В следующем примере минимальная высота элемента равна «3cm»:

Пример

html> html> head> title>Заголовок документа title> style> p < background-color: #ccc; > p.example < min-height: 3cm; > style> head> body> h2>Пример свойства min-height h2> h3>Min-height: none. h3> p>Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне. p> h3>Min-height: 3cm. h3> p class="example">Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне. p> body> html>

Значения

Значение	Описание
auto	Устанавливает минимальную высоту. Значение по умолчанию.
length	Устанавливает минимальную высоту в единицах измерения (px, pt, cm и т.д.). Значение по умолчанию — 0.
%	Устанавливает минимальную высоту в процентах.
initial	Устанавливает свойство в значение по умолчанию.
inherit	Значение элемента наследуется от родительского элемента.

Поддержка браузера

Источник

min-height

The min-height CSS property sets the minimum height of an element. It prevents the used value of the height property from becoming smaller than the value specified for min-height .

Try it

The element’s height is set to the value of min-height whenever min-height is larger than max-height or height .

Syntax

/* value */ min-height: 3.5em; /* value */ min-height: 10%; /* Keyword values */ min-height: max-content; min-height: min-content; min-height: fit-content(20em); /* Global values */ min-height: inherit; min-height: initial; min-height: revert; min-height: revert-layer; min-height: unset; 

Values

Defines the min-height as an absolute value.

Defines the min-height as a percentage of the containing block’s height.

The browser will calculate and select a min-height for the specified element.

The intrinsic preferred min-height .

The intrinsic minimum min-height .

Uses the fit-content formula with the available space replaced by the specified argument, i.e. min(max-content, max(min-content, argument)) .

Formal definition

Initial value	auto
Applies to	all elements but non-replaced inline elements, table columns, and column groups
Inherited	no
Percentages	The percentage is calculated with respect to the height of the generated box’s containing block. If the height of the containing block is not specified explicitly (i.e., it depends on content height), and this element is not absolutely positioned, the percentage value is treated as 0 .
Computed value	the percentage as specified or the absolute length
Animation type	a length, percentage or calc();

Formal syntax

min-height =
auto |
|
min-content |
max-content |
fit-content( )

=
|

Examples

Setting min-height

table  min-height: 75%; > form  min-height: 0; > 

Specifications

Browser compatibility

BCD tables only load in the browser

See also

Found a content problem with this page?

This page was last modified on Jul 18, 2023 by MDN contributors.

Your blueprint for a better internet.

MDN

Support

Our communities

Developers

Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
Portions of this content are ©1998– 2023 by individual mozilla.org contributors. Content available under a Creative Commons license.

Источник

CSS min-height Property

Set the minimum height of a

element to 200 pixels:

Definition and Usage

The min-height property defines the minimum height of an element.

If the content is smaller than the minimum height, the minimum height will be applied.

If the content is larger than the minimum height, the min-height property has no effect.

Note: This prevents the value of the height property from becoming smaller than min-height .

Default value:	0
Inherited:	no
Animatable:	yes, see individual properties. Read about animatable Try it
Version:	CSS2
JavaScript syntax:	object.style.minHeight=»400px» Try it

Browser Support

The numbers in the table specify the first browser version that fully supports the property.

CSS Syntax

Property Values

Value	Description	Demo
length	Default value is 0. Defines the minimum height in px, cm, etc. Read about length units	Demo ❯
%	Defines the minimum height in percent of the containing block	Demo ❯
initial	Sets this property to its default value. Read about initial
inherit	Inherits this property from its parent element. Read about inherit

Источник