Skip to main content
adicionou 3 caracteres ao conteúdo
Fonte Link
Sam
  • 80,8mil
  • 22
  • 73
  • 128

Não aparece porque ela provavelmente está num contêiner sem uma altura declarada no CSS. Desta forma o height ficam sem referência, já que seria a porcentagem da altura de um elemento pai. Se o elemento pai não possui um height declarado, logo não tem como calcular a porcentagem de vazio0.

Se essa div tiver como pai o body, por exemplo, e você der uma altura a ele, irá aparecer mesmo vazia:.

body{
   height: 100vh;
}

.quadrant {
  background-color: #E7E7E7;
  margin: auto;
  height: 40%;
  width: 20%;
}
<div class="quadrant">
</div>

O que você pode fazer, se não puder definir uma altura para o contêiner da div, é declarar uma altura mínima em pixels. Por exemplo:

min-height: 100px;

Não aparece porque ela provavelmente está num contêiner sem uma altura declarada no CSS. Desta forma o height ficam sem referência, já que seria a porcentagem da altura de um elemento pai. Se o elemento pai não possui um height declarado, logo não tem como calcular a porcentagem de vazio.

Se essa div tiver como pai o body, por exemplo, e você der uma altura a ele, irá aparecer mesmo vazia:

body{
   height: 100vh;
}

.quadrant {
  background-color: #E7E7E7;
  margin: auto;
  height: 40%;
  width: 20%;
}
<div class="quadrant">
</div>

Não aparece porque ela provavelmente está num contêiner sem uma altura declarada no CSS. Desta forma o height ficam sem referência, já que seria a porcentagem da altura de um elemento pai. Se o elemento pai não possui um height declarado, logo não tem como calcular a porcentagem de 0.

Se essa div tiver como pai o body, por exemplo, e você der uma altura a ele, irá aparecer mesmo vazia.

body{
   height: 100vh;
}

.quadrant {
  background-color: #E7E7E7;
  margin: auto;
  height: 40%;
  width: 20%;
}
<div class="quadrant">
</div>

O que você pode fazer, se não puder definir uma altura para o contêiner da div, é declarar uma altura mínima em pixels. Por exemplo:

min-height: 100px;
adicionou 3 caracteres ao conteúdo
Fonte Link
Sam
  • 80,8mil
  • 22
  • 73
  • 128

Não aparece porque ela provavelmente está num contêiner sem dimensõesuma altura declarada no CSS. Desta forma o width e o height ficam sem referência, já que sãoseria a porcentagem da altura de um elemento pai. Se o elemento pai não possui dimensões declaradasum height declarado, logo não tem como calcular a porcentagem de vaziovazio.

Se essa div tiver como pai o body, por exemplo, e você der uma altura a ele, irá aparecer mesmo vazia:

body{
   height: 100vh;
}

.quadrant {
  background-color: #E7E7E7;
  margin: auto;
  height: 40%;
  width: 20%;
}
<div class="quadrant">
</div>

Não aparece porque ela provavelmente está num contêiner sem dimensões. Desta forma o width e o height ficam sem referência, já que são porcentagem de um elemento pai. Se o elemento pai não possui dimensões declaradas, logo não tem como calcular a porcentagem de vazio.

Se essa div tiver como pai o body, por exemplo, e você der uma altura a ele, irá aparecer mesmo vazia:

body{
   height: 100vh;
}

.quadrant {
  background-color: #E7E7E7;
  margin: auto;
  height: 40%;
  width: 20%;
}
<div class="quadrant">
</div>

Não aparece porque ela provavelmente está num contêiner sem uma altura declarada no CSS. Desta forma o height ficam sem referência, já que seria a porcentagem da altura de um elemento pai. Se o elemento pai não possui um height declarado, logo não tem como calcular a porcentagem de vazio.

Se essa div tiver como pai o body, por exemplo, e você der uma altura a ele, irá aparecer mesmo vazia:

body{
   height: 100vh;
}

.quadrant {
  background-color: #E7E7E7;
  margin: auto;
  height: 40%;
  width: 20%;
}
<div class="quadrant">
</div>

Fonte Link
Sam
  • 80,8mil
  • 22
  • 73
  • 128

Não aparece porque ela provavelmente está num contêiner sem dimensões. Desta forma o width e o height ficam sem referência, já que são porcentagem de um elemento pai. Se o elemento pai não possui dimensões declaradas, logo não tem como calcular a porcentagem de vazio.

Se essa div tiver como pai o body, por exemplo, e você der uma altura a ele, irá aparecer mesmo vazia:

body{
   height: 100vh;
}

.quadrant {
  background-color: #E7E7E7;
  margin: auto;
  height: 40%;
  width: 20%;
}
<div class="quadrant">
</div>