Submitted over 2 years ago

Responsive landing page by using Flex and Grid

Suprefuner• 470

@Suprefuner

Preview site View code

This is a solution for...

Clipboard landing page

HTML
CSS

2junior

View challenge

Design comparison

SolutionDesign

Solution retrospective

Any suggestion and feedback would be appreaciated!!!! Thanks for reviewing my code!

Community feedback

David Turner• 4,100

@brodiewebdt

Posted over 2 years ago

The desktop version looks great. The mobile version isn't kicking in for me. Check your media query. Check the report above, you are using attributes that don't exist to style your elements. Also, move your CSS from the HTML file to a separate style sheet. `

Hope this helps.

Marked as helpful

Suprefuner• 470

@Suprefuner

Posted over 2 years ago

@brodiewebdt Thanks for your feedback!

May I know what is wrong about the mobile version? It looks good on my computer by using edge.
For the attribute part, will change back to padding/margin -top/-bottom/-left/right instead of padding/margin-block/inline considering the browser support issue. They are too convenient. LOL
For the css part, will do in the next project.

David Turner• 4,100

@brodiewebdt

Posted over 2 years ago

Looking at the site on iPad, it looks good. It could be the HTML issues causing the problems. I use Chrome, Firefox, Edge, Netlify and am checking out Polypane to test my sites.

Please log in to post a comment

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