BotAldaris• 140
@BotAldaris
Submitted
What could I improve to this code?
Jordan Kleinbaum
@JordanKleinbaum
All comments
- Jordan Kleinbaum• 210
@JordanKleinbaum
Posted
Great job! Everything looks great. Just from a UX perspective, it is a little redundant to have the orange carrot to the right as well as the black one to the left. Besides that, everything looks good!
0 - billynguyen25• 70
@billynguyen25
Submitted
Generally struggled on the sizing of the container, was unsure how to get it centred for a while.
Jordan Kleinbaum• 210@JordanKleinbaum
Posted
Also for your image not loading, I had the same problem. Make sure you use the exact right file path in your html head section when linking your css. Read this for more help
Marked as helpful
0 - billynguyen25• 70
@billynguyen25
Submitted
Generally struggled on the sizing of the container, was unsure how to get it centred for a while.
Jordan Kleinbaum• 210@JordanKleinbaum
Posted
Here are a couple ways to Center A DIV:
-position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
-display: grid; place-items: center; min-height: 100vh;
-display: flex; align-items: center; justify-content: center; min-height: 100vh; width: 100%;
-position: absolute; inset: 0; margin: auto;
Putting any one of these 4 methods in your body section of your css should center whatever you start making :)
Marked as helpful
0 - Juliano Paulo• 20
@Gary068
Submitted
My first challenge on this site!
Jordan Kleinbaum• 210@JordanKleinbaum
Posted
Great job! Practice makes progress!
0 @Gemgabriel1
Submitted
My page displays without the qr code? I need help on how to make it display properly on the git pages
Jordan Kleinbaum• 210@JordanKleinbaum
Posted
I also had this problem too. I tried a bunch of solutions, but the one that worked for me was creating the shortest possible file path to your image. For example I see in your code that you linked it like this "<img src="C:\Users\hi\Desktop\qr-code-component-main\images\image-qr-code.png" alt="qr code" class="qr-code">"
That finds the image by using the root of your files, and then going all the way through the path to the image. In my code, I linked my image like this "<img src="images/image-qr-code.png" alt="QR Code Image" class="pic" />". Both ways (how you did it and how I did it) are technically fine, but it's always good to make your code as manageable as possible for others and the computer.
Here is a link to my repo where you can see all of the code. https://github.com/JordanKleinbaum/QRCodeFrontEndMentor/blob/main/index.html
Shorten the link to your image and see if that changed anything! (ps, github pages also takes a few minutes to update everything)
0
