CodeCow/freeCodeCamp
1
0
Fork 0
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git synced 2026-06-19 21:09:51 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

chore(curriculum): updating responsive web design lecture block (#57503)

Browse Source 
Co-authored-by: Ilenia <26656284+ilenia-magoni@users.noreply.github.com>
This commit is contained in:
Jessica Wilkins 2024-12-12 13:12:32 -08:00 committed by GitHub
parent b7169549bb
commit 19cd0ea3fd
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 13 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
curriculum/challenges/_meta/lecture-best-practices-for-responsive-web-design/meta.json
View File

@ -14,13 +14,13 @@
"id": "672cf05c3ad533eabe1e8197",
"title": "How Do Media Queries Work, and What Are Some Common Media Types and Features?"
},
{
"id": "672cf06c8f46f9eb04db9832",
"title": "What Is the Mobile First Approach in Responsive Web Design?"
},
{
"id": "672cf07a2b9796eb49719e03",
"title": "What Are Media Breakpoints, and What Are Common Breakpoints in Modern Design?"
},
{
"id": "672cf06c8f46f9eb04db9832",
"title": "What Is the Mobile First Approach in Responsive Web Design?"
}
],
"helpCategory": "HTML-CSS"

18
curriculum/challenges/english/25-front-end-development/lecture-best-practices-for-responsive-web-design/672cf07a2b9796eb49719e03.md
View File

@ -50,35 +50,35 @@ Think about how websites adapt to various device sizes.
## --text--
In a mobile-first approach, which type of media query is typically used for breakpoints?
Which of the following is a commonly used breakpoint for smaller devices like smart phones?
## --answers--
`max-width`
1640px
### --feedback--
Consider how styles are added as screen sizes increase from mobile to desktop.
Review the beginning of the video to see where this was discussed.
---
`min-width`
640px
---
`max-height`
1200px
### --feedback--
Consider how styles are added as screen sizes increase from mobile to desktop.
Review the beginning of the video to see where this was discussed.
---
`min-height`
2000px
### --feedback--
Consider how styles are added as screen sizes increase from mobile to desktop.
Review the beginning of the video to see where this was discussed.
## --video-solution--
@ -114,7 +114,7 @@ Think about which screen resolution is less commonly targeted in responsive desi
---
`2560px` (4K displays).
`6000px` (really large device).
## --video-solution--