P
@rfnozn
Latest solutions
social-links-profile
Submitted 4 months agoHow do I structure my repository for frontendmentor.com projects in a nice way? Should I work in the main zip folder or bring my HTML and CSS files out of that to work with?
qr-code-component
Submitted 4 months agoCould you tell me if my code could have been cleaner, more professional or more efficient? If yes, how so?
Latest comments
- @subjectiverealityy
Your codebase looks good and your webpage is fully responsive. No complaints here.
- P@chryspenalberWhat are you most proud of, and what would you do differently next time?
I was able to finish the project in half a day, making it responsive with Flexbox and clamp().
What challenges did you encounter, and how did you overcome them?At first, I struggled to keep the card responsive, but the clamp() function was a big help.
@subjectiverealityyYou did well. Looking at your code, you didn't use React though (and it was tagged). I almost didn't check because I'm not familiar with React. Your code looks clean and efficient.
Something to note though is that IDs should not be used so often in CSS. Classes are preferable when assigning reusable styles because they can be applied to different elements (e.g. div, p, button, etc) at once. You can use them to style multiple elements with the same attributes.
IDs are useful when working with Javascript but are preferably used when only one <h1> or <p> or whatever element you choose has the applied styling. IDs are also useful as anchor links. Otherwise, they should probably be used sparingly (this is what I've read online).
For more information, you can message ChatGPT with the following statement: 'when to use class and when to use id in CSS'. ChatGPT helps me a lot with figuring out how to achieve a particular result with my code.
Marked as helpful - @NiravJoshi33What are you most proud of, and what would you do differently next time?
I created a responsive page. I am proud of that.
What challenges did you encounter, and how did you overcome them?I faced an issue in setting the width of the page. I played around with adding extra div and applying CSS to it.
What specific areas of your project would you like help with?importing fonts
@subjectiverealityyIf you go to fonts.google.com and pick a font, you will see the option of 'get embed code'. Click on that, then copy the way you want to import it, whether as a <link> into your HTML or using @import for CSS. Then paste this, into the appropriate section in your code editor.
- If you choose to use <link>, paste it in the <head> section of your HTML file.
- If you choose to use @import, paste it at the very beginning of you CSS file.
Marked as helpful - @Texxo98@subjectiverealityy
The 'author's image' did not load properly on the final webpage. Perhaps your file path was incorrect? I had a similar issue when I tried to push my screenshot to my remote repository but I have now resolved it.
If you need to go back one level, use ../ If you need to go back two levels, use ../../ and so on If you need to go forward one level, use / e.g. root files/inner folder/file in inner folder
Marked as helpful - @Mustafizali@subjectiverealityy
Looks good, especially if you replicated by sight and not using a Figma file, but you didn't add padding to the bottom. Sizes and colours are slightly different but I think that's okay. We can always add our own flair as front-end developers. If you intended to follow the design exactly though, then there's some work to be done. Have a good day :)
