Design comparison
SolutionDesign
Solution retrospective
Challenges
- Layout of the desktop with Grid CSS (Lots of frustration and time to get this eventually 'right'
- Making the height of the landing page the full height of the screen without overlay.
Stoked With
- Learnt some JavaScript
- Got the desktop & mobile layout looking close to the challenge.
Questions
- How do you add transitions to JS addEventListener? (My mobile menu just pops out without any transition)
Community feedback
- @0xabdulPosted over 1 year ago
Hello Developer well congratulations on successfully completing the News homepage
- A Little bit suggestions for improve your code
- In Html 📃 :
- LANDMARKS 🚀
- the html page should be contained one main landmark
- to clear the Accessibility reports use sematic elements or non semantic elements..
- Semantic elements ⚙️
- <aside> <nav> <section> <main> <header> <footer> <article> Ect..
- using semantic elements
- Ex :
<html lang="en"> <head> <title>my page</title> </head> <body> <header> //logo img or heading ect... //Using heading only </header> <main> //Use only main of the contents </main> <footer> //use copy write discription or challenge d by front end mentor code by mark.. </footer> </body> </html>- HEADING ⚠️
- the heading level increase by one
- the html documents must be contained level of headings 🚀
- We Do ✓
- Ex :
<h1> </h1> <h2> </h2> <h3> </h3> <h4> </h4>- We use the headings line by line or sequence
- Don't Do !
- Ex :
<h2> </h2> <h3> </h3> <h4> </h4> <h3> </h3>- Note : we use the headings line by line or sequence way
- I Hope you find the solution and it's useful comment for you your News Homepage is awesome 🤩 Happy Coding Developer..
0
Please log in to post a comment
Log in with GitHub
Join 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