Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

qr-code-component

@Pranjal412

Desktop design screenshot for the QR code component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Please help me how to write media queries

Community feedback

@nina1234567896

Posted

Hi there! i am quite impressed. I also recently finished the project but I'm having trouble with writing down the proper relative path. How did you write your relative path?

0

@bthnorhan

Posted

You can create a series of rules that will be applied based on the screen size or device orientation to use media queries in CSS.

/* Default styles */
body {
font-size: 16px;
}

/* Media query for screens over 768px */
@media (min-width: 768px) {
body {
font-size: 18px;
}
}

The 'body' element in this example has a default style with a font size of 16 pixels. Then, when the screen width is more than or equal to 768 pixels, we add a media query that will take effect. We increase the 'body' element's font size within this media query to 18 pixels. For various screen sizes and orientations, as well as for other elements like font size, color, and layout, you can utilize additional media queries.

0

Please log in to post a comment

Log in with GitHub
Discord logo

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