Ostatnio edytowany:

min-height

Autor: Virtual Patriot

Opis właściwości min-height

Za pomocą właściwości min-height możemy określić rozmiar minimalnej wysokości obszaru zawartości interesującego nas elementu HTML.

Dodatkowe techniczne informacje o właściwości min-height

przeznaczenie
dziedziczenie
  • nie
wartość initial
  • 0
wyjątki initial
  • brak
animowanie
  • tak

Interpretacja właściwości min-height

Firefox

tak

Google Chrome

tak

Safari

tak

Opera

tak

Internet Explorer

tak, lecz od wersji 7

Edge

tak

Zobacz więcej informacji o interpretacji właściwości .

Opis wartości właściwości min-height

rozmiar

Opis

Za pomocą właściwości min-height oraz dowolnej nieujemnej liczby wraz z wybraną jednostką absolutną lub jednostką relatywną lub za pomocą procentów możemy określić rozmiar minimalnej wysokości obszaru zawartości interesującego nas elementu HTML.

Wartości procentowe

wartości procentowe liczone są względem aktualnego rozmiaru wysokości obszaru zawartości najbliższego elementu przodka tworzącego blok treści

Dla zaawansowanych

zasada dotycząca najbliższego elementu przodka tworzącego blok treści jest prawdziwa tylko wtedy, gdy element HTML, do którego chcemy dodać właściwość min-height wraz z wartością wyrażona za pomocą procentów posiada pozycję static lub pozycję relative (dla pozostałych typów pozycji należy zapoznać się dokładniej z poszczególnymi wartościami właściwości position)

wartość procentowa nie może zostać obliczona przez przeglądarkę internetową, gdy finalny rozmiar wysokości obszaru zawartości wspomnianego elementu przodka jest nieznany

sytuacje, gdy finalny rozmiar wysokości obszaru zawartości wspomnianego elementu przodka jest nieznany:

  • gdy element przodek posiada poziomy tryb zapisu treści oraz właściwość height wraz z wartością auto lub wartością wyrażoną za pomocą procentów, które nie mogą zostać obliczone przez przeglądarkę internetową, lecz tylko w sytuacji, gdy element HTML, do którego chcemy dodać właściwość min-height wraz z wartością wyrażona za pomocą procentów posiada pozycję static lub pozycję relative

Przykład

rozmiar minimalnej wysokości obszaru zawartości tego elementu "div" wynosi 200 pikseli, ponieważ do tego elementu "div" została dodana właściwość "min-height" wraz z wartością "200px"

Kod źródłowy przykładu

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="utf-8">
    <title>Darmowy Kurs CSS</title>

    <style>
      html {
        font-size:16px;
        font-family:Helvetica, sans-serif;
      }

      div {
        min-height:200px;
        font-size:1.3em;
        background-color:#AFF;
      }
    </style>
  </head>

  <body>

    <div>
      rozmiar minimalnej wysokości obszaru zawartości tego elementu "div" wynosi 200 pikseli, ponieważ do tego elementu "div" została dodana właściwość "min-height" wraz z wartością "200px"
    </div>

  </body>
</html>