Mobile-Responsive landing page with flexbox, grid and DOM manipulation


Desktop design screenshot for the Easybank landing page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
View Challenge

Design Comparison




Accessibility Issues


HTML Issues

View Report

Israel Adefidipe’s questions for the community

My first project applying DOM manipulation. It was really cool. I, kind of, had some difficulty styling the hero images in this project.

what I did: For the mobile view, I made the hero svg a background image and the mockup, a ::before psuedo element of the same element that had the svg backgroung and that worked. In the desktop view, I had to make the mockup a html img element of its own to be able to achieve the design.

Please, If you have a better idea on how I achieved this, feel free to share... i feel there should be a better way to have done it. Your feedbacks will be really appreciated.

Community Feedback

Give some feedback to @iadefidipe about their solution...

Slack logo

Join our Slack community

Join over 80,000 people taking the challenges, talking about their code, helping each other, and chatting about all things front-end!