Responsive landing page using Flex box

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  👾Fala Marco, tudo bem? Parabéns pela sua solução.

  Vi aqui que você usou overflow: hidden; e faz sentido, mas se você prestar atenção quando a tela começa a diminuir e os elements de texto começam a se movimentar pra ajustar na tela, o overflow: hidden; começa a cortar o texto dentro container. Minha sugestão seria você ativar o media query um pouco antes dos textos começarem a cortar ou tirar o overflow.

  Pra bater exatamente o mesmo efeito de cor na imagem, você precisa adicionar a image no html com <img> e colocar no css o efeito mix-blend-mode: multiply; e opacidade opacity: 0.7;

  Espero ter te ajudo e parabéns, vi seu último projeto e ficou bem foda.

  Marked as helpful

  1

  ---

  

  Marco Tullio•90

  @MarcoFrancaPosted over 2 years ago

  @correlucas obrigado pelo feedback! é verdade, vou corrigir e me atentar nos outros códigos

  quanto ao mix-blend-mode: multiply; com opacidade, eu desconhecia da existencia, muito obrigado por compartilhar o seu conhecimento.

  1
• 

  Luis Herrera•795

  @Luis15HerrPosted over 2 years ago

  Hello, you could use a:

  background-size: cover;

  In your class: .card--img

  So that the background-img of your div: fills all the free space.

  Marked as helpful

  0

  ---

  

  Marco Tullio•90

  @MarcoFrancaPosted over 2 years ago

  @Luis15Herr Hi, thanks a million for your explanation.

  now my code is much better

  1