Galera já tinha subido esse vídeo só que a versão anterior está com um erro de edição. Desculpa a galera que já tinha feito comentário no vídeo anterior. Tirei um print dos comentários que já estavam lá: imgur.com/a/tSelhop
Uma pergunta: No absolute, se ela estiver dentro de um elemento pai, para que ela obedeça o pai precisamos atribuir a ele qualquer valor de position que não seja o static certo? Ok. No fixed, o posicionamento de top, bottom, left e right acontecem segundo o tamanho do browser assim como no relative, então no fixed a lógica é a mesma? Se quisermos que o fixed tenha o tamanho e posição da div pai como referencia temos que mudar o valor de position do pai para diferente de static?
5:00 Seria o height que foi repetido um com 40px e outro com 60px no mesmo objeto? Foi maus é que estou querendo entender porque tinha 2 height ali depois vi este comentário aqui.
Brother, um amigo me indicou seu canal, eu relutei em assistir, pois já estava desistindo de aprender as funcionalidades do CSS, mas teus vídeos estão me salvando, melhor didática!
Doido! Se eu pudesse postar aqui um áudio, você poderia ouvir meus gritos de alegria!!!!!!!!!!! Assisti todos os videos da playlist, nunca a remova do UA-cam. Tenho certeza que vai ajudar muita gente! Sou além de outras coisas, risos, programador (muito mais back do que front) a quase 35 anos. Nunca havia recebido uma explicação tão boa, tão clara e PRINCIPALMENTE os motivos de certos comportamentos de elementos e suas propriedades para qualquer um que trabalhe ou deseje, o meu caso, poder escrever um html com css entendendo realmente o comportamento das coisas. Parabéns! Obrigado por compartilhar seus conhecimentos!! Abraço
Que série maravilhosa! A forma com que você começa todos os vídeos explicando os mesmos detalhes torna cada vídeo único, não necessariamente dependendo do anterior e isso facilita bastante a questão das consultas! Parabéns!
Cara, eslareceu muito minhas dúvidas sobre o comportamento do position, porque a galera geralmente explica superficialmente como ele funciona, aí ficam aquelas dúvidas de: "Mas porque a outra div some?", "Como resolver a centralização?", "Porque não empurrou pra baixo?". A galera que faz vídeos tutoriais não costuma explicar esses detalhezinhos que as vezes fazem a gente ficar quebrando a cabeça com position, float, e outros atributos. Valeu pela disposição em esclarecer esses pontos! 🌺😉
Olá Bruno, sou estudante, iniciante do curso de Analise e desenvolvimento de sistemas, estou aprendendo muito com seus vídeos, bastante didático!! Gostaria de pedir que se possível, você dar uma aula sobre Tags Semânticas, quero parar de chutar!!!kkkk Grande abraço e valeu cara..
Eu não estava entendendo nada dessa parte de position! Vi dois vídeos seus e me sinto muito feliz! Parabéns pela didática...torcendo pra fuçar nas suas redes e ter curso seu hahaha vlw!
Marco, que sabadão foi esse que eu tirei e quanto to aprendendo aqui de CSS anotando tudo para por em prática tudo, estava com muita dificuldade em posicionar os elementos agora ficou muito mais claro, depois de seguir todos os videos até aqui da série Pare de chutar o CSS!!! Depois praticar muito e ir acrescentando div's e mais div's para exercitar e testar bem!!! muito obrigado mesmo por esses excelentes!!! CONTEÚDO e muito conteúdo!!1. =]. S2
pqp! fiz uma maratona agora de manhã e assisti os videos. Eu só ia na base do chute! não achava uma fonte de informações abrangente quanto o conteudo q vc fez. parabéns e obrigado.
muito show, estou aprendendo rápido e bem, didática excelente.... senti falta de algo no final! dai utilizei a ideia do padding-top no body e fiz um padding-bottom para não incobrir o final da página.
Você consegue explicar tudo de uma forma super detalhada, mas muito didática. Estou fazendo um curso de front-end, e assistindo a seus vídeos pra entender melhor alguns conceitos. Muito bom!
Muito bom esses vídeos, parabéns, faz 1 mês que estou estudando posicionamento no css, e ficava tatiando no escuro até conseguir posicionar os elementos.. e com esses vídeos perderei menos tempo com testes e farei códigos muito mais acertivos. Parabéns e obrigado por compartilhar o conhecimento.
Rapaz! Nem precisa "encher o teu saco" nas redes sociais e telegram! 😍 seus vídeos são super didáticos e motivantes de assistir. Mais uma fez meus parabéns! Você não imagina o quanto me ajudou e a preocupação que saiu da minha cabeça...agora eu realmente sei como formatar a estrutura de um site usando CSS (conhecimento adquirido apenas assistindo os teus vídeos). Mais um escrito com certeza!!! 😃😃😃😃😃😃😃
Cara, já tenho alguns anos de experiência e meu ponto fraco sempre foi o CSS, principalmente quando o assunto é position. Confesso que com suas explicações isso está mudando!! Seus vídeos são muito bons!! Obrigado.
Vídeos muito bons. Me encaixei perfeitamente na situação de ter aprendido o básico de html e css e ter dificuldade na questão de posicionamento. E os vídeos foram muito bons para esclarecer minhas dúvidas. Valeu!
Opa Bruno,queria um vídeo que explicasse a diferença de trabalho usando flexbox e usando div. Acho que é uma dúvida atual de trabalho para muitos, com relação boas práticas para facilitar a criação de layout de forma mais rápida e com código menor. Abraço
vlw, vou usar o codigo do baner q vc odeia mas para fazer aqueles botoes que ficam la em baixo no canto infeior direito, para adicionar algo como um cadastro e coisas assim.
Pq tinha dois height no call to action? Aula muito top mano! Podia fazer um curso de Html e desenvolvimento web. Ia bombar. Parabeéns pela didática incrível.
Primeiro, gostaria de dizer que eu achei muito bom essa playlist que você criou, alias achei excelente, você está de parabéns!!! Mas eu fiquei com uma dúvida, porque assim, eu tentei colocar a propriedade padding-button no elemento body, porque meu texto ficou atrás do botão e não era possivel eu subir mais para ler, e não funcionou, nesse caso o que você sugeriria fazer? Muito obrigada
vc ensinou que width 100% faz com que ele ocupe 100% da tela, porem, como faco pra ele ocupar 100% de uma div apenas? ja que quando coloco position: fixed; em um elemento, ele pega as margens da tela e nao da div
Cara, excelentes vídeos, vi toda a playlist de uma vez. Mas agora me peguei com a seguinte dúvida: por que o line-height: pode conter toda a altura do elemento e, ao mesmo tempo, centralizar o texto (uma só linha ou palavra)? Pesquisei sobre ele e segundo o site do Majur o line-height é calculado a partir do baseline da frase ou palavra. Bom, como ele é a altura da linha, acredito que o calculo corresponde a traçar uma linha imaginária a x pixels para cima a partir da baseline da palavra ou frase, é isso? Se for, como ele centraliza já que só acresce espaço em um sentido (para cima) e não nos dois (no caso, também para baixo)? Muito obrigado.
Oi Marco, beleza velho? Cara, uma dúvida, porque utilizar uma propriedade para mover o eixo do elemento em vez de apenas alterar a porcentagem fixa (ex. reduzir 5%)? Qual a diferença? Abraço
Ótimo vídeo. Ficou uma dúvida: quando vc "empurrou" o conteúdo para baixo do header usando padding no body, o margin-bottom do header não ficou sem sentido (inutilizável)?
Professor, porque quando eu coloco um padding ou margin 50% no meu body, ele não fica os ideais 50% em relação ao fixed, tipo assim no meu fixed eu coloquei 50% height ate ai tanquilasso juntamente com um padding ou margin no pixel fica bom, mas se eu tentar colocar porcentagem no body o conteudo fica super depois do fixed não é o mesmo calculo dos 50% height do meu fixed
Como não havia a imagem pra baixar eu fiz um header próprio, bem simples, sofri pra consertar alguns coisas, mas consegui colocar tudo no jeito pra começar a aula, ai quando chegou na hora de colocar o top do header como 0, o conteúdo do meu paragrafo está ficando por cima do meu header ao fazer scroll...tentei usar o transform: translateY(1) no header, pensando que ele viria pra frente de modo a encobrir o paragrafo durante o scroll, mas nada...alguém me ajuda kkkk
oi Matt, tudo bem? manda sua dúvida lá no Discord, não sei já faz parte, mas se não faz já cola que é bem feliz! se eu não respondo o pessoal se ajuda: discord.gg/FP5UaAG
permite que o contexto continue dentro da caixa e nunca extrapole, é meio que delimitar o espaço dentro da caixa. E todo valor adicionado vai permanecer dentro da caixa.
Galera já tinha subido esse vídeo só que a versão anterior está com um erro de edição. Desculpa a galera que já tinha feito comentário no vídeo anterior. Tirei um print dos comentários que já estavam lá:
imgur.com/a/tSelhop
Uma pergunta: No absolute, se ela estiver dentro de um elemento pai, para que ela obedeça o pai precisamos atribuir a ele qualquer valor de position que não seja o static certo? Ok. No fixed, o posicionamento de top, bottom, left e right acontecem segundo o tamanho do browser assim como no relative, então no fixed a lógica é a mesma? Se quisermos que o fixed tenha o tamanho e posição da div pai como referencia temos que mudar o valor de position do pai para diferente de static?
5:00 Seria o height que foi repetido um com 40px e outro com 60px no mesmo objeto?
Foi maus é que estou querendo entender porque tinha 2 height ali depois vi este comentário aqui.
um video de 2018 me salvando em quase 2022, abrigado Marco
Tamo junto!!!
Brother, um amigo me indicou seu canal, eu relutei em assistir, pois já estava desistindo de aprender as funcionalidades do CSS, mas teus vídeos estão me salvando, melhor didática!
Fico feliz em conseguir ajudar :-)
Doido! Se eu pudesse postar aqui um áudio, você poderia ouvir meus gritos de alegria!!!!!!!!!!!
Assisti todos os videos da playlist, nunca a remova do UA-cam. Tenho certeza que vai ajudar muita gente!
Sou além de outras coisas, risos, programador (muito mais back do que front) a quase 35 anos. Nunca havia recebido uma explicação tão boa, tão clara e PRINCIPALMENTE os motivos de certos comportamentos de elementos e suas propriedades para qualquer um que trabalhe ou deseje, o meu caso, poder escrever um html com css entendendo realmente o comportamento das coisas.
Parabéns! Obrigado por compartilhar seus conhecimentos!!
Abraço
Com certeza está ajudando muito!!
esté me ajudando e muito irmão.
Que série maravilhosa! A forma com que você começa todos os vídeos explicando os mesmos detalhes torna cada vídeo único, não necessariamente dependendo do anterior e isso facilita bastante a questão das consultas! Parabéns!
Valeu! Isso é algo que tento fazer em todos os vídeo, infelizmente alguns não dá por serem o andamento de um projeto, aí fica dentro de uma série :-)
Cara, eslareceu muito minhas dúvidas sobre o comportamento do position, porque a galera geralmente explica superficialmente como ele funciona, aí ficam aquelas dúvidas de: "Mas porque a outra div some?", "Como resolver a centralização?", "Porque não empurrou pra baixo?". A galera que faz vídeos tutoriais não costuma explicar esses detalhezinhos que as vezes fazem a gente ficar quebrando a cabeça com position, float, e outros atributos. Valeu pela disposição em esclarecer esses pontos! 🌺😉
Nunca vi uma aula tão explicativa como essa, muito obrigado Marco ! aula muito mais que boa.
Olá Bruno, sou estudante, iniciante do curso de Analise e desenvolvimento de sistemas, estou aprendendo muito com seus vídeos, bastante didático!! Gostaria de pedir que se possível, você dar uma aula sobre Tags Semânticas, quero parar de chutar!!!kkkk Grande abraço e valeu cara..
Eu não estava entendendo nada dessa parte de position! Vi dois vídeos seus e me sinto muito feliz! Parabéns pela didática...torcendo pra fuçar nas suas redes e ter curso seu hahaha vlw!
Marco, que sabadão foi esse que eu tirei e quanto to aprendendo aqui de CSS anotando tudo para por em prática tudo, estava com muita dificuldade em posicionar os elementos agora ficou muito mais claro, depois de seguir todos os videos até aqui da série Pare de chutar o CSS!!!
Depois praticar muito e ir acrescentando div's e mais div's para exercitar e testar bem!!! muito obrigado mesmo por esses excelentes!!! CONTEÚDO e muito conteúdo!!1. =]. S2
A melhor playlist que já vi sobre posicionamento no CSS, parabéns Bruno, continue postando vídeos, pare não. Ajuda demais a gente.
pqp! fiz uma maratona agora de manhã e assisti os videos. Eu só ia na base do chute! não achava uma fonte de informações abrangente quanto o conteudo q vc fez. parabéns e obrigado.
Valeu! Fucovque tenha gostado e que tenha te ajudado :-)
Excelente ! Muito bem explicado ! ! Parabéns pelos vídeos ! ! !
muito show, estou aprendendo rápido e bem, didática excelente.... senti falta de algo no final! dai utilizei a ideia do padding-top no body e fiz um padding-bottom para não incobrir o final da página.
Você consegue explicar tudo de uma forma super detalhada, mas muito didática. Estou fazendo um curso de front-end, e assistindo a seus vídeos pra entender melhor alguns conceitos. Muito bom!
Muito bom esses vídeos, parabéns, faz 1 mês que estou estudando posicionamento no css, e ficava tatiando no escuro até conseguir posicionar os elementos.. e com esses vídeos perderei menos tempo com testes e farei códigos muito mais acertivos. Parabéns e obrigado por compartilhar o conhecimento.
Marco mando bem , valeu , gratidão.
Rapaz! Nem precisa "encher o teu saco" nas redes sociais e telegram! 😍 seus vídeos são super didáticos e motivantes de assistir. Mais uma fez meus parabéns! Você não imagina o quanto me ajudou e a preocupação que saiu da minha cabeça...agora eu realmente sei como formatar a estrutura de um site usando CSS (conhecimento adquirido apenas assistindo os teus vídeos). Mais um escrito com certeza!!! 😃😃😃😃😃😃😃
Fico feliz que tenha gostado :-)
Melhor canal pra tirar as dúvidas do css, muito obrigado cara 👍
que video top, tirou todas minhas duvidas ,obgd!!!
pqp mano, que playlist boa!! Explica de uma forma descontraida e muito facil de entender. Parabens!! Espero mais conteúdos como esse
Didática muito boa, propriedade aprendida com sucesso!!!
que aula top mano me salvou estava loco aqui quebrando cabeça com isso vlw
feliz em ajudar Felix! cola lá no Discord da CollabCode, quando tiver dúvida, pessoal sempre se ajuda: discord.gg/FP5UaAG
Valeu irmão me ajudou!! 😀
Cara, já tenho alguns anos de experiência e meu ponto fraco sempre foi o CSS, principalmente quando o assunto é position. Confesso que com suas explicações isso está mudando!! Seus vídeos são muito bons!! Obrigado.
Ótima explicação, parabéns pela didática.
Vídeos muito bons. Me encaixei perfeitamente na situação de ter aprendido o básico de html e css e ter dificuldade na questão de posicionamento. E os vídeos foram muito bons para esclarecer minhas dúvidas. Valeu!
Por nada. Fico feliz que tenha aprendido :-)
A série ficou perfeita, aprendi muito sobre o CSS, muito obrigado!!!!
muito bom! muito bem explicado!!
Obrigado pelo vídeo e pela aula! Bem explicada!
O brabo 🔥
Valeu!
Fera demais!! Obrigado!!
Valeu! Fico feliz que tenha gostado
Manero sua forma de esplicar,me salvou de um trabalho......Brigadoooo.....
É nois e obrigado
Muito obrigado irmão, you safe my life
Valeeeeeu Paulo :-)
Muito bom! Sua didática é incrível 👏👏
excelente explicação.
Muito obrigado mano
muito bom me ajudo muito
Tamo junto!
Opa Bruno,queria um vídeo que explicasse a diferença de trabalho usando flexbox e usando div. Acho que é uma dúvida atual de trabalho para muitos, com relação boas práticas para facilitar a criação de layout de forma mais rápida e com código menor.
Abraço
Muito bom!
Fico muito feliz que tenha gostado. Cola aí pra trocar ideia com a comunidade no servidor do Discord: discord.gg/YeeEAYj
muito bom!
belas aulas, me inscrevi no seu canal, você parece ter muita coisa para passar !
Abraços, e sucesso !
Fico feliz que tenha gostado Well. Amanhã vou fazer um vídeo sobre emmet.io
:-)
Obrigado cara....
Tamo junto
Muito bom seus vídeos! Espero que vc faça bastante! Obrigado!
Fico feliz que esteja gostando :-)
Estou aprendendo muito sobre posicionamento, inclusive, coloquei no boy a padding-bottom: 50px, para a última linha ficar acima do botão.
Nice muito bom :-)
Fico feliz que esteja aprendendo e evoluindo o role.
Marco é possível usar display: flex e tbm usar position:fixed juntos? Parabéns pela didática, vc é um ótimo professor
ótimo conteúdo :) muito obrigada pela dedicação!
Por nada. Fico feliz que tenha gostado
Top
top
Topersom
Ajudou demais
vlw, vou usar o codigo do baner q vc odeia mas para fazer aqueles botoes que ficam la em baixo no canto infeior direito, para adicionar algo como um cadastro e coisas assim.
Ganhou um inscrito
Muito obrigado mesmo. Estava procurando como fazer esses codigos, valeu mesmo!
faz dos flex box e grid por favor
Estou devendo, mas farei
Muito bom! ;)
Pq tinha dois height no call to action? Aula muito top mano! Podia fazer um curso de Html e desenvolvimento web. Ia bombar. Parabeéns pela didática incrível.
Acho que só esqueci um height a mais kkk
Se tivesse uma foto ou uma cor de fundo de fundo, não poderia fazer, no body, o distanciamento, correto?
daria pra fazer o mesmo efeito com o sticky?
Vlw mano, ótimo conteúdo!!! Agora não vai ser mais no chute. KKK
Primeiro, gostaria de dizer que eu achei muito bom essa playlist que você criou, alias achei excelente, você está de parabéns!!! Mas eu fiquei com uma dúvida, porque assim, eu tentei colocar a propriedade padding-button no elemento body, porque meu texto ficou atrás do botão e não era possivel eu subir mais para ler, e não funcionou, nesse caso o que você sugeriria fazer? Muito obrigada
Ficou faltando adicionar im "padding-bottom: 50px;" na tag body para que o conteúdo também não fique abaixo do botão verde!
Que bom que te achei o fígado pela aula top
pqp me ajudou pakas.......
um pexis vale quantos pixeis?
Marco, muito obrigado. "Maratonei" os 7 primeiro vídeos e você me tirou as dúvidas sobre position... Você tem algum curso na Alura?? Sou aluno lá.
vc ensinou que width 100% faz com que ele ocupe 100% da tela, porem, como faco pra ele ocupar 100% de uma div apenas? ja que quando coloco position: fixed; em um elemento, ele pega as margens da tela e nao da div
esse Position ta muito parecido com o Float ... como faço pra diferenciar ?
onde está o link do github com o código do video . qual o github dele ?
Cara, excelentes vídeos, vi toda a playlist de uma vez. Mas agora me peguei com a seguinte dúvida: por que o line-height: pode conter toda a altura do elemento e, ao mesmo tempo, centralizar o texto (uma só linha ou palavra)? Pesquisei sobre ele e segundo o site do Majur o line-height é calculado a partir do baseline da frase ou palavra. Bom, como ele é a altura da linha, acredito que o calculo corresponde a traçar uma linha imaginária a x pixels para cima a partir da baseline da palavra ou frase, é isso? Se for, como ele centraliza já que só acresce espaço em um sentido (para cima) e não nos dois (no caso, também para baixo)? Muito obrigado.
É isso sim. Mas tem uma outra propriedade chamada vertical-align e é por conta dela que fica centralizada por padrão
Oi Marco, beleza velho? Cara, uma dúvida, porque utilizar uma propriedade para mover o eixo do elemento em vez de apenas alterar a porcentagem fixa (ex. reduzir 5%)? Qual a diferença? Abraço
Da forma que fiz a manutenção fica mais feliz, o 5% causará outros breakpointers
Não consigo te achar no Telegram de jeito nenhum
Ótimo vídeo. Ficou uma dúvida: quando vc "empurrou" o conteúdo para baixo do header usando padding no body, o margin-bottom do header não ficou sem sentido (inutilizável)?
Verdade ficou!
Professor, porque quando eu coloco um padding ou margin 50% no meu body, ele não fica os ideais 50% em relação ao fixed, tipo assim no meu fixed eu coloquei 50% height ate ai tanquilasso juntamente com um padding ou margin no pixel fica bom, mas se eu tentar colocar porcentagem no body o conteudo fica super depois do fixed não é o mesmo calculo dos 50% height do meu fixed
Vixi! Não peguei a ideia, você tem um link com o código que esta fazendo? :-)
@@MarcoBrunoDev Eu poderia colar aqui?
@@renatomartins6735 usa o codepen..io que vai ser mais feliz prara de ajudar
@@MarcoBrunoDev HAHA valeuzao nem sabia disso achei bacana , o link
codepen.io/anon/pen/pGVOBV
eu fiz anonimo pq não tinha login ve se pega
Como não havia a imagem pra baixar eu fiz um header próprio, bem simples, sofri pra consertar alguns coisas, mas consegui colocar tudo no jeito pra começar a aula, ai quando chegou na hora de colocar o top do header como 0, o conteúdo do meu paragrafo está ficando por cima do meu header ao fazer scroll...tentei usar o transform: translateY(1) no header, pensando que ele viria pra frente de modo a encobrir o paragrafo durante o scroll, mas nada...alguém me ajuda kkkk
consegui usando z-index :D
o pessoal daqueles sites com xxx adoram esse banner no meio da tela
Esqueceu de dar o padding-bottom
meu header não fica clicavel, oque pode ter acontecido
oi Matt, tudo bem? manda sua dúvida lá no Discord, não sei já faz parte, mas se não faz já cola que é bem feliz! se eu não respondo o pessoal se ajuda: discord.gg/FP5UaAG
o qq aconteceu com isso "box-sizing: border-box; " ?
permite que o contexto continue dentro da caixa e nunca extrapole, é meio que delimitar o espaço dentro da caixa. E todo valor adicionado vai permanecer dentro da caixa.
nao foi
to entendendo tudo ! desculpe
nao aprendi