gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

fix(curriculum): Replace single-line blocks with multi-line blocks for Responsive Web Design (#41519)

Browse Source 
* fix(curriculum) replace single-line block with multi-line blocks

* fix(curriculum) replace single-line block with multi-line blocks (missed blocks)
This commit is contained in:
Sem Bauke
2021-03-19 00:24:09 +01:00
committed by GitHub
parent a4e4ffce99
commit b064991667
36 changed files with 136 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
curriculum/challenges/english/01-responsive-web-design/responsive-web-design-principles/create-a-media-query.md
View File

@ -15,11 +15,15 @@ Media Queries consist of a media type, and if that media type matches the type o
Here's an example of a media query that returns the content when the device's width is less than or equal to 100px:
`@media (max-width: 100px) { /* CSS Rules */ }`
```css
@media (max-width: 100px) { /* CSS Rules */ }
```
and the following media query returns the content when the device's height is more than or equal to 350px:
`@media (min-height: 350px) { /* CSS Rules */ }`
```css
@media (min-height: 350px) { /* CSS Rules */ }
```
Remember, the CSS inside the media query is applied only if the media type matches that of the device being used.

4
curriculum/challenges/english/01-responsive-web-design/responsive-web-design-principles/make-typography-responsive.md
View File

@ -17,7 +17,9 @@ The four different viewport units are:
Here is an example that sets a `body` tag to 30% of the viewport's width.
`body { width: 30vw; }`
```css
body { width: 30vw; }
```
# --instructions--