otimo video ! so corrigindo que o flex-flow é um atalho para o flex-direction mais o flex-wrap juntos , e o flex é um atalho para flex-grow , flex-shrink e flex-basis tudo junto.
Muito bom amigo, obrigado por passar teu conhecimento de forma gratuita. Estou com mais de 1 ano atrasado, mas também gostaria de acrescentar uma pequena explicação para ajudar ainda mais o entendimento da questão entre "space-between", "space-around" e "space-evenly" (que esqueceste de dizer). Space-between ele separa as divs com o mesmo espaçamento "INTERNO", ele joga (gruda) o primeiro div para o start (ponto 0), joga (gruda) o último div para o end (ponto X), e o que tiver no meio (interno) será dividido pelo mesmo espaçamento entre eles. Space-around, faz a mesma coisa, mas ele ao invés de meter o primeiro para o start e o último para o end, ele mete o mesmo espaçamento para todos os divs, é como se você mete-se margin iguais para todas as divs do conteiner. Space-evenly, é a junção dos dois, põe o mesmo espaçamento entre todos os elementos. A diferença prática é que os espaços entre eles é igual em todos os "lados" de cada div, incluindo o espaço entre o ponto 0 (start) e o ponto X (end), mas ignora a questão da soma de dois espaços iguais entre os elementos interno, como acontece no space-around. No evelyn, literalmente ele pega a soma de todo o container e divide todas as divs internas com o mesmo espaçamento entre eles. Se fizerem o teste fica mais fácil de perceber isso. Também gostaria de fazer uma correção na informação do video. FLEX-FLOW é um shorthand, isso quer dizer que é um comando de atalho, onde você agrupa mais que um comando ao mesmo tempo reduzindo o tamanho do css por assim dizer. o flex-flow ela agrupa no mesmo comando os comando flex-direction e flex-wrap. Ex. flex-flow: column-reverse norap; O que foi explicado ai no video é o comando FLEX-WRAP, que tem como propriedades nowrap, wrap e wrap-reverse. ex: flex-wrap: wrap-reverse; (este comando ele vai fazer uma quebra no axis e inverter a ordem dos elementos div na renderização do navegador cliente, não no código em si. Outro detalhe é que o comando flex também é um shorthand, no minuto 25 do video, o comando correto é flex-grow. Lembrando que flex-grow: 1 e flex-shrink: 1, não precisa ser declarado porque é o default. O comando flex é o comando que agrupa mais que um comando, no caso o flex-grow, flex-shrink e o flex-basis no mesmo comando. Se me permite, gostaria de indicar um "jogo" de css para práticar o CSS FLEX. Link abaixo. flexboxfroggy.com/ Também gostaria de indicar um site que complementa o video e que tem me ajudado muito a compreender as propriedades do CSS FLEX. (Lembrando que não tenho vínculo nenhum ao site que indico, faço isso para tentar ajudar mais na compreensão destas propriedade que atualmente são tão importantes. E assim como me tem ajudado, tenho certeza que ajudará muita gente). www.alura.com.br/artigos/css-guia-do-flexbox? Agradeço novamente a boa vontade de tentar nos ensinar. E tens mais um inscrito. Conteúdo bom, vale a pena seguir.
Vídeo aula muito boa parabéns, me respondeu várias dúvidas que eu tinha, uma das coisas que reforçou bastante e já até gravou em minha cabeça é a questão do main axis e cross axis, agora bora praticar. E novamente parabéns pelo vídeo, gostei muito.
cara os seu curso estão me ajudando muito eu estou em Angola e estou estudando seus cursos com uma galera professor faz um curso falando sobre media queurie
Vou ter que dizer que vc é um dos melhores professores que encontrei no UA-cam. Ótima produção de conteúdo e excelente didática. Estava meio confuso com alguns conceitos e a sua explicação foi exemplar. Muito obrigado, parabéns pelo trabalho.
Ótimo vídeo, cara. Saciou uma boa parte das minhas dúvidas. Mas ficou uma em questão: sempre quando eu quiser fazer algo mais responsivo, eu preciso necessariamente usar o display flex? Ou existe outras maneiras pra isso? Tô falando isso levando em consideração esses grandes sites que existem e tem suporte para celular também, todos são feitos com display flex?
Boa aula Felipe, muito top. As nomenclaturas são um pouco dificil de assimilar. Mas tenho uma dúvida, o seu index.html fica um endereço de IP + o nome da página. Como fez para ficar assim? Ou é automático? Minha pergunta é devido o meu estar o caminho com o nome do desktop+pasta etc etc... Vlw!!!
Gente: boa tarde. Algo que está me deixando preso é como devo alinhar o "tamanho das divs" em aplicações web com responsívidade. Percebo que usam VH PX % já vi aulas em outras fontes que usam REM, porém particularmente não consegui fazer uma relação com o uso pratico. Se devo usar apenas uma unidade de medida, ou se varia. Perdoe a ignorância: mas já vi que px não é responsívo, tou no meio dessa salada de informações kkk. Existe um passo atrás que posso dar pra entender melhor? Caso alguém tenha passado pela mesma questão, compartilha como superou. Agradeço.
otimo video ! so corrigindo que o flex-flow é um atalho para o flex-direction mais o flex-wrap juntos , e o flex é um atalho para flex-grow , flex-shrink e flex-basis tudo junto.
Muito bom amigo, obrigado por passar teu conhecimento de forma gratuita. Estou com mais de 1 ano atrasado, mas também gostaria de acrescentar uma pequena explicação para ajudar ainda mais o entendimento da questão entre "space-between", "space-around" e "space-evenly" (que esqueceste de dizer). Space-between ele separa as divs com o mesmo espaçamento "INTERNO", ele joga (gruda) o primeiro div para o start (ponto 0), joga (gruda) o último div para o end (ponto X), e o que tiver no meio (interno) será dividido pelo mesmo espaçamento entre eles. Space-around, faz a mesma coisa, mas ele ao invés de meter o primeiro para o start e o último para o end, ele mete o mesmo espaçamento para todos os divs, é como se você mete-se margin iguais para todas as divs do conteiner. Space-evenly, é a junção dos dois, põe o mesmo espaçamento entre todos os elementos. A diferença prática é que os espaços entre eles é igual em todos os "lados" de cada div, incluindo o espaço entre o ponto 0 (start) e o ponto X (end), mas ignora a questão da soma de dois espaços iguais entre os elementos interno, como acontece no space-around. No evelyn, literalmente ele pega a soma de todo o container e divide todas as divs internas com o mesmo espaçamento entre eles. Se fizerem o teste fica mais fácil de perceber isso.
Também gostaria de fazer uma correção na informação do video. FLEX-FLOW é um shorthand, isso quer dizer que é um comando de atalho, onde você agrupa mais que um comando ao mesmo tempo reduzindo o tamanho do css por assim dizer. o flex-flow ela agrupa no mesmo comando os comando flex-direction e flex-wrap.
Ex. flex-flow: column-reverse norap;
O que foi explicado ai no video é o comando FLEX-WRAP, que tem como propriedades nowrap, wrap e wrap-reverse. ex: flex-wrap: wrap-reverse; (este comando ele vai fazer uma quebra no axis e inverter a ordem dos elementos div na renderização do navegador cliente, não no código em si.
Outro detalhe é que o comando flex também é um shorthand, no minuto 25 do video, o comando correto é flex-grow. Lembrando que flex-grow: 1 e flex-shrink: 1, não precisa ser declarado porque é o default. O comando flex é o comando que agrupa mais que um comando, no caso o flex-grow, flex-shrink e o flex-basis no mesmo comando.
Se me permite, gostaria de indicar um "jogo" de css para práticar o CSS FLEX. Link abaixo.
flexboxfroggy.com/
Também gostaria de indicar um site que complementa o video e que tem me ajudado muito a compreender as propriedades do CSS FLEX. (Lembrando que não tenho vínculo nenhum ao site que indico, faço isso para tentar ajudar mais na compreensão destas propriedade que atualmente são tão importantes. E assim como me tem ajudado, tenho certeza que ajudará muita gente).
www.alura.com.br/artigos/css-guia-do-flexbox?
Agradeço novamente a boa vontade de tentar nos ensinar. E tens mais um inscrito. Conteúdo bom, vale a pena seguir.
Vídeo aula muito boa parabéns, me respondeu várias dúvidas que eu tinha, uma das coisas que reforçou bastante e já até gravou em minha cabeça é a questão do main axis e cross axis, agora bora praticar. E novamente parabéns pelo vídeo, gostei muito.
cara os seu curso estão me ajudando muito eu estou em Angola e estou estudando seus cursos com uma galera
professor faz um curso falando sobre media queurie
Didática excelente! Muito obrigado.
Conteúdo de qualidade! Excelente!
Vou ter que dizer que vc é um dos melhores professores que encontrei no UA-cam. Ótima produção de conteúdo e excelente didática. Estava meio confuso com alguns conceitos e a sua explicação foi exemplar. Muito obrigado, parabéns pelo trabalho.
Excelente!! Obrigado Professor!
Suas aulas são ótimas! :) Melhor didática que eu encontrei. Parabéns e muito obrigada pelo meu aprendizado.
Nunca aprendi tanto com uma pessoa como você! Muito obrigado!
Felipe seu trabalho é lindo cara. Vc terá ainda muito mais sucesso na vida. Vc é um cara iluminado irmão!
Muito bom seu vídeo, parabens cumpadi
Faz um curso de Javascript pfv. Sua didática é muito boa! Queria aprender Javascript mais fácil,igual aprendi html e css básico...
Anotado! Em breve sairá, André!! 🔥
Ajudou muito meu brother eu estava muito confuso fazendo um projeto aqui mas agora tudo se encaixou, até já conclui ele
Ai cara vc é perfeito haha amei a sua didática, foi a unica que me fez entender de verdade como funciona o Grid e o Flexbox. Obrigado de verdade
Fico feliz que tenha gostado!! =)
otimo video amigo! muito didatico! muitissimo obrigada!
obrigado por partilhar seu conhecimento, Deus te abençoe por isso!
Eu assisti várias vídeos de flex box ficava confuso, agora deu pra entender, vlw pelo vídeo. 😁👍
Muito bom! Parabéns! Tô aprendendo muito no seu canal! Obrigado!
Muito bom!!! Didatica muito boa, contiua fazendo esse material
Obrigado, Arthur! 👊
Top mano parabéns pelo vídeo
ótimo vídeo , obrigado !
explicou mt bem, like
Vakeu fera, excelente tutorial sobre flexbox, estamos aprendendo contigo,....show!!
Rapaz que didática incrivel !! aprendi diretinho
Muito obrigado, Felipe!!!! Cara, tu é foda! Fez diferença nos meus estudos
Excelente conteúdo show!
Parabéns pelo vídeo!! Uma da melhores explicações que encontrei!! 👏🏻👏🏻👏🏻
Ajudou muito obrigado !!
Faz um curso de PHP ou Laravel
Ótimo, para variar rs Esperando o próximo vídeo
Video mt bom! Agora aprendi !
MARAVILHOSO
Didática excelente!!!!!!
obrigado irmão!!
Ótimo vídeo, cara. Saciou uma boa parte das minhas dúvidas. Mas ficou uma em questão: sempre quando eu quiser fazer algo mais responsivo, eu preciso necessariamente usar o display flex? Ou existe outras maneiras pra isso? Tô falando isso levando em consideração esses grandes sites que existem e tem suporte para celular também, todos são feitos com display flex?
SERIO TA PH****DA ! Parabens !
muito obrigado amigo!!
Excelente didática!!!!
ASSISTI EM 2X E APRENDI FLEX BOX EM 15 MINUTOS
Excelente aula
Obrigado!!
Muito bom 👏👏
Agora eu aprendi esse trem 🤣🤣
Fico feliz em lhe ajudar, Dayane!
ótimo vídeo, me ajudou muito
Ótimo curso, ajudou muito.
valeu irmão!
vlw man!
Muito bom conteúdo, ótimo ajudou 👏🏼👏🏼👏🏼
Ensinando Programar muito obrigado meu amigo! 😄
Parabéns 👏. Vídeo muito bom
muito obrigado amigo!
top top top !!
Ainda não entendi qual a diferença entre os Flex Items "flex", "flex-basis", e "flex-grow" 🤔
Boa aula Felipe, muito top. As nomenclaturas são um pouco dificil de assimilar. Mas tenho uma dúvida, o seu index.html fica um endereço de IP + o nome da página. Como fez para ficar assim? Ou é automático? Minha pergunta é devido o meu estar o caminho com o nome do desktop+pasta etc etc... Vlw!!!
Muito bom! 👏👏👏👏
muito obrigado pelo apoio de sempre, Leandro!
vc e foda
muito bom, apenas o audio esta um pouco baixo! de resto ta otimo!
Meu flex-flow não está criando já segunda linha
Gente: boa tarde. Algo que está me deixando preso é como devo alinhar o "tamanho das divs" em aplicações web com responsívidade. Percebo que usam VH PX % já vi aulas em outras fontes que usam REM, porém particularmente não consegui fazer uma relação com o uso pratico. Se devo usar apenas uma unidade de medida, ou se varia. Perdoe a ignorância: mas já vi que px não é responsívo, tou no meio dessa salada de informações kkk. Existe um passo atrás que posso dar pra entender melhor? Caso alguém tenha passado pela mesma questão, compartilha como superou. Agradeço.
entrou um pouco mais na cabeça mas ainda ta complicado kkkkk
estranhamente, flex-flow: wrap não está funcionando para mim
pra mim também não
flex-flow é uma junçao de flex-direction e flex-wrap ,tenta usar so flex-wrap: wrap;