Skip to content
Submitted over 1 year ago

responsive page with html css

naharki•20
@naharki
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...QR code component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

How is it? This is my first project, suggestions will be appreciated

Community feedback

  • Hoshiko•180
    @oliwiakrammPosted over 1 year ago

    This comment was deleted 9 months ago

    2
    naharki•20
    @naharkiPosted over 1 year ago

    @oliwiakramm thanks for your feedback and i hopes for the feedback like this in upcomming future chalenges too.

    0
  • Melvin Aguilar 🧑🏻‍💻•61,140
    @MelvinAguilarPosted over 1 year ago

    Hello 👋. Congratulation on successfully completing your first challenge 🎉 ! !

    I have other recommendations regarding your code that I believe will be of great interest to you.

    HTML 🏷️:

    • The text Improve Your Front-End Skills by Building Projects is considered a heading element (h1).

    Font 🔤:

    • It's recommended that you always use the font provided by the challenge's style guide.To import a font, follow the steps below:

      • Go to the font's page on Google Fonts: https://fonts.google.com/specimen/Outfit.
      • A sidebar will appear with a code snippet that you can use to import the font.
      • Copy this code snippet and paste it into the <head> section of your HTML document.
      • Now you can use the "Outfit" font in your CSS by specifying font-family: 'Outfit', sans-serif;.

    CSS 🎨:

    • Setting the width of the component with a percentage or a viewport unit (vh) will behave strangely on mobile devices or large screens. You should use a max-width of 320px or 20rem to make sure that the component will have a maximum width of 320px on any device, also remove the width property with a percentage value.

    CSS Reset 🔄:

    • You should use a CSS reset. A CSS reset is a set of CSS rules that are applied to a webpage in order to remove the default styling of different browsers.

      CSS resets that are widely used:

    I hope you find it useful! 😄 Above all, the solution you submitted is great!

    Happy coding!

    2
    naharki•20
    @naharkiPosted over 1 year ago

    @MelvinAguilar Thanks for your feedback. I really admire your words

    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