📌 What You Will Learn
- Writing clean and meaningful HTML
- Styling layouts using CSS
- Making sections responsive for different screen sizes
🛠 What You Have To Do
-
Go to the folder:
webdev/contributors/<your_enrollment_number>/task-01/
-
Add a new section to the page
(examples: About, Features, Why TechTonic)
-
Use semantic HTML tags such as:
-
Style the section using Flexbox or CSS Grid
-
Ensure the section looks clean on:
- Desktop screens
- Mobile screens
📁 Where To Work
webdev/contributors/<your_enrollment_number>/task-01/
✍️ Mandatory Explanation (explanation.md)
Inside the same folder, create a file named:
In this file, write in your own words and explain:
-
What you understood from this task
(What was the goal? What was expected from you?)
-
How you implemented the solution
(Why you chose certain HTML tags or CSS layout method)
-
What you learned from this task
(New concepts, mistakes you realized, improvements)
-
What you think is good about your solution
(Structure, readability, responsiveness, etc.)
-
What could be improved or what felt difficult
(Even small things — honesty matters)
-
Any other thoughts that came to your mind while working
(Confusion, clarity moments, questions, ideas)
⚠️ This explanation must be original and personal.
Generic or AI-generated explanations will be rejected.
✅ When Is This Task Complete?
- New section is visible on the page
- HTML is clean and semantic
- Layout does not break on small screens
explanation.md is present and properly written
❌ Rules
- ❌ No Tailwind / Bootstrap
- ❌ No JavaScript
- ❌ No inline CSS
- ❌ No copied explanations
Submission requirements
- Attach the screenshots of your work (mobile and desktop both)
- brief description
🧠 Mentor Note (for contributors)
We care more about your explanation than perfect design.
Write honestly — there is no “right” answer in reflection.
📌 What You Will Learn
🛠 What You Have To Do
Go to the folder:
Add a new section to the page
(examples: About, Features, Why TechTonic)
Use semantic HTML tags such as:
sectionheaderarticleStyle the section using Flexbox or CSS Grid
Ensure the section looks clean on:
📁 Where To Work
✍️ Mandatory Explanation (
explanation.md)Inside the same folder, create a file named:
In this file, write in your own words and explain:
What you understood from this task
(What was the goal? What was expected from you?)
How you implemented the solution
(Why you chose certain HTML tags or CSS layout method)
What you learned from this task
(New concepts, mistakes you realized, improvements)
What you think is good about your solution
(Structure, readability, responsiveness, etc.)
What could be improved or what felt difficult
(Even small things — honesty matters)
Any other thoughts that came to your mind while working
(Confusion, clarity moments, questions, ideas)
✅ When Is This Task Complete?
explanation.mdis present and properly written❌ Rules
Submission requirements
🧠 Mentor Note (for contributors)