Responsive with Flexbox

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  👾Fala Alephy, beleza? Parabéns pelo seu novo desafio!

  Acabei de dar uma olhada no seu código e tenho umas dicas pra você:

  1.Cria uma classe pra gerir todos os três cartões e outra classe pra cada card individualmente, por exemplo uma classe pros 3 cartões pra definir eles como max-width: 300px e deixar eles responsivos e com o tamanho certo. Note que você usou width.

  2.Deixa pra ativar a media query um pouco depois por causa do espaço lateral muito grande quando o card fica vertical ou então deixar os cartões crescerem 100% da largura e colocar só uma margem pra separar eles das bordas da tela.

  3.Pra aplicar o efeito de Hover no botão basta você criar um botão com borda branca e com o background da cor de cada cartão. Ai ele vai fazer aquele efeito OUTLINE.

  Depois me diz se essas modificações funcionaram.

  Valeu!

  Marked as helpful

  0

  ---

  

  Alephy [ BR ]•80

  @alephy9Posted over 2 years ago

  @correlucas

  Eu não consegui colocar duas classes na mesma tag do html, as 3 divs que tenho, acabei colocando 3 id e implementei o max-width e também fiz todo reajuste nos códigos simplificando mais adicionando classes em titulos e paragrafos pra configurar de uma só vez vários elementos, consegui eliminar muita linha de código e deixei bem mais elegante do que tava antes. Mas o id eu to duvidoso pq só se usa um por documento? e eu acabei colocando nas 3 divs, mas vou tentar de uma forma melhor no entanto fiz com id pra mostrar como ficou.

  os botoes eu criei a borda e deixei o hover transparente mostrando o fundo do background dos cartões.

  o @media eu consegui colocar pequenas linhas, diferente das centenas que eu havia feito...

  Me ajudou muito eu consegui acertar o posicionamento do paragrafo muito mais rápido.

  Se eu tiver que melhorar (pq sinto isso) ou algo que eu não consegui compreender pode me informar que eu vou buscar conhecimento, eu gosto de aprender.

  0

  

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  @alephy9 boa, cara em relação ao Id, seria melhor você deixar pra quando tiver um formulário ou Javascript, dá pra resolver tudo só com classe mesmo. O ideal é você criar classes pra coisas que se repetem muito tipo padding, border radius, tamanho de fonte, porque aí você escreve menos código.

  Marked as helpful

  0