Design comparison
Solution retrospective
Main thing I struggled with was the structure of my HTML. I kept going back to revise the class names and feel like ive made them too long at times and there could be an easier solution for this.
Is there a way I could of done this better?
Community feedback
- @correlucasPosted about 2 years ago
👾Hello @maxted83, congratulations for your new solution!
I saw your preview site and I realized that you've created the solution for the wrong file, when you download the starter files it comes with 3 jpeg images (desktop, mobile and preview). Seems that you created the design for the preview one and you need to do instead the mobile/desktop.
A quick way to fix it is just by removing the background-color/shadow from the container and add just the bg color to the body to make it display the whole screen.
Regarding your html structure:I saw that you've used a lots of divs and its not really necessary, for example the right column with the text content needs a div only for the button and the pricing section, the other content can stand alone.
Something other you can do its to wrap both images (mobile/desktop) using the
picture tagand instead of using a div for the column with the text content you can use<article>\✌️ I hope this helps you and happy coding!
Marked as helpful0
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