Eu gostaria de saber se tem como e se tiver como eu faço para deixar o menu lateral de forma fixa quando eu desço a tela ( tipo acompanhado quando desce) e também que ela ocupe de forma total a altura da tela
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Eu gostaria de saber se tem como e se tiver como eu faço para deixar o menu lateral de forma fixa quando eu desço a tela ( tipo acompanhado quando desce) e também que ela ocupe de forma total a altura da tela
Para ocupar a altura total pode utilizar o height: 100vh e para menu fixo usar position: fixed.
.menu_lateral{ position: fixed; height: 100vh; }
Oi Caio, tudo bem?
Tem sim! Você pode fazer dessa forma:
@media screen and (min-width: 1440px) {
.menu-lateral {
position: fixed;
left: 0;
height: 100vh;
width: 200px;
grid-column: 1;
grid-row: 1 / span 2;
}Dar um position:fixed para fixar quando você desce a tela, e o height:100vh para ocupar de forma total como você queria.
Para que ele reconheça a largura do menu lateral, você vai ter que tirar o auto do grid-template-columns e colocar um valor, no caso coloquei 200px.
@media screen and (min-width: 1440px) {
body {
display: grid;
grid-template-columns: 200px 1fr;
}
Você pode ver aqui nesse gif que fiz no meu projeto, ficou muito legal! Sua ideia foi muito boa, parabéns :D
Espero ter ajudado!
Um abraço e bons estudos.
Muito obrigado Lorena e Mateus ajudaram muito.