Huddle landing page with a single introductory section

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  Fala Luciano, beleza? Parabéns pela sua nova solução!

  Eu olhei o site da solução e gostei mto do jeito que vc montou a estrutura do HTML, uma coisa que dá pra melhorar é a largura do background svg que não tá cobrindo a tela toda, pra mudar isso vc pode usar background-size: contain ou background-size: cover.

  Pra melhorar a semântica vc pode inserir os ícones das rede sociais com listas <ul><li>

  Espero que ajude, continue no foco 👊

  Marked as helpful

  2
• 

  Elaine•11,400

  @elaineleungPosted about 2 years ago

  Hi Luciano, glad that you used a mobile-first approach, and yes, it's quite life changing!

  You did a lot of things well here, including using a container. One thing I suggest here is to use a limiting width to stop the main content from stretching too much on large screens (I'm viewing this on a large screen). To do that, try adding this to the .container:

  .container {
     width: min(100%, 100em);  // feel free to experiment with this value!
     margin-inline: auto;
  }
  
  

  Great work once again!

  Marked as helpful

  1
• 

  Adriano•38,390

  @AdrianoEscarabotePosted about 2 years ago

  Ola @LucianoOliveira1, tudo bem?

  Gostei bastante do resultado do seu layout, mas tenho algumas dicas que suponho que você gostará:

  Observei que o layout não estava tão centralizado, fiz algumas alterações para arrumar isso:

  body{ display: flex; align-items: center; justify-content: center; min-height: 100vh; }

  Percebi que a imagem de fundo estava quebrando, você pode arrumar dessa forma:

  background-size: cover !important;

  O resto está ótimo! Você efetuou um ótimo trabalho na responsividade do projeto.

  Espero que ajude... 👍

  Marked as helpful

  1