Estou tendo um probleminha quando se trata da área em que um componente ocupa. Eu trabalho com softwares para academia e estou fazendo uma tela de login, fiz um componente "Login.component", dentro fiz componentes filhos "Cpf.Componente", "Senha.component" e etc... Quero que a tela de login possua uma imagem, porém só a tela de login terá essa imagem, porém quando coloco a imagem, ela só cobre metade da tela, a outra metade é o index.html, tem alguma maneira de eu falar que o componente "Login.component" vai ocupar 100% da tela mesmo não tendo conteúdo suficiente para isso?
Boa tarde, Bruno.
O melhor seria você compartilhar seu código html e css para termos certeza, mas no geral, podes definir o width de um elemento para 100%. Isso fará com que a largura dele seja toda a largura do elemento pai. O mesmo vale para o height.
Claro, existem situações em que os elementos não se comportam assim, por isso seria importante você mostrar o seu código para que possamos dar uma resposta mais concreta.
Abraços.
Apenas com estas informações não podemos lhe ajudar de forma eficiente. É preciso analisar seu código para poder apontar a solução. Vc tem whats?
Olá,
Você pode utilizar a unidade de medida vh e o background-size: cover do CSS 3.
Exemplo:
.my-container {
background-image: url('path_imagem_aqui');
height: 100vh;
background-size: cover;
}
Veja um exemplo aqui - https://codepen.io/angelorubin/pen/dyojXMj
