Design comparison
Solution retrospective
I am a beginner in web development, and I had a difficulty understanding the behavior of CSS. Due to my lack of experience in CSS styling, do you have any recommended resources regarding best practices, tricks, and techniques?
Community feedback
- @iElvisJosuePosted over 1 year ago
Good job! :)
I checked your HTML structure and since you're starting this will probably help (Based on your structure).
Your HTML:
<div class="container"> <img src="./images/image-qr-code.png" alt="QR code" height="100%" width="100%"> <div class="title-container"> <h1>Improve your front-end skills by building projects</h1> </div> <div class="description-container"> <p>Scan the QR Code to visit the Frontend Mentor and take your coding skills to the next level</p> </div> </div>
You can try this:
<main class="container"> <img src="./images/image-qr-code.png" alt="QR code" height="100%" width="100%"> <header class="title-container"> <h1>Improve your front-end skills by building projects</h1> </header > <section class="description-container"> <p>Scan the QR Code to visit the Frontend Mentor and take your coding skills to the next level</p> </section> </main>
Marked as helpful1 - @meantoesPosted over 1 year ago
Hi! congrats on completing your first challenge⭐
I have some recommendations for you
- wrap your whole content with
<main>
tag, you can learn more about HTMLsemantic tags
here - use
relative units
for margin, padding, width, and height. learn more about it here
for resources, I recommend you to check Kevin Powell's YouTube Channel, he gives lots of tricks and tips about CSS. I also recommend Web Dev Simplified, this is my preference, I like the way he explained things.
oh and, check this video from the CEO of Scrimba, you might become more comfortable in web dev after knowing those checklists.
hope this helps, have a great day⭐ and happy coding🙌🏻
2 - wrap your whole content with
- @cacti00Posted over 1 year ago
Hi! I recommend Kevin Powells YouTube channel he talks about everything regarding css from beginner level to advanced.
He also has a free course (Conquering Responsive Layouts) you can try it out.
0
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord