All comments

• 

  pauzuffinetti• 90

  @pauzuffinetti

  Submitted 7 months ago

  What are you most proud of, and what would you do differently next time?

  Hi! I'm trying to become a great front end developer, discovering this page makes me so excited! Any constructive criticism is always welcome!

  What challenges did you encounter, and how did you overcome them?

  Making the QR be in the middle of the page

  What specific areas of your project would you like help with?

  Honestly, any errors you see or anything that you've done differently, just let me know. I love learning and i welcome advice from those who are more experienced.

  

  Responsive QR code | HTML&SCSS

  2

  90

  

  Birusha• 60

  @BirushaNdegeya

  Posted 7 months ago

  Hello there 👋 👋 @pauzuffinetti,

  Your project looks great, but I have some suggestions to improve its accessibility. Consider using <main role="main"></main> instead of <div></div>, and you don't need to use these properties to center your container:

  .bigcontainer {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  

  Instead, it is a good practice to do:

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

  I hope this answers some of your questions. If you have any other questions, feel free to ask me.

  🌟 🌟 🌟 Happy coding! 🌟 🌟 🌟

  0
• 

  Halalisani Sibisi• 10

  @HalalisaniSibisi

  Submitted 7 months ago

  What are you most proud of, and what would you do differently next time?

  What I'm most proud is being able to gain more experience when it comes to the div elements, in most cases I tend to make mistakes if I have to do another div inside the div, which can confuse me when I style them.

  What I can do differently is centering the div, I had a problem doing that especially since the qr code was in the the middle of the page so, I will try to improve on that.

  What challenges did you encounter, and how did you overcome them?

  When it comes to css, there are many elements you need to take into consideration especially when it comes to widths, margins etc, so that gave me a huge problem especially when I had to move the picture in the middle. I did a bit of some research on the Internet and that kind of helped to see where I went wrong.

  What specific areas of your project would you like help with?

  • How can center it in the middle
  • How can I get I get the margins right without making everything complicated and confusing.
  • how can I make my layout be more responsive.

  

  QR code solution using technologies of HTML and CSS

  3

  70

  

  Birusha• 60

  @BirushaNdegeya

  Posted 7 months ago

  Hello @HalalisaniSibisi!

  Your project looks great!

  I have one suggestion for you to improve it even more:

  Using margin is not the best option to center an element. Here's a very efficient (and better) way to place an element in the middle of the page both vertically and horizontally:

  📌 Apply this to the body (in order to work properly, don't use position or margins):

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

  I hope it helps!

  Happy Coding ...

  Marked as helpful

  0

  This comment has received 2 repliesShow