jprdonnelly/freeCodeCamp
1
0
Fork 0
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git synced 2026-03-10 19:01:13 -04:00
Code Issues Projects Releases Wiki Activity

fix(curriculum): introduce css max in accessibility-quiz (#50738)

Browse Source 
Co-authored-by: Naomi Carrigan <nhcarrigan@gmail.com>
This commit is contained in:
a2937
2023-06-22 08:44:10 -04:00
committed by GitHub
parent d17ce537d9
commit 29e69ed080
1 changed files with 11 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
curriculum/challenges/english/14-responsive-web-design-22/learn-accessibility-by-building-a-quiz/613e275749ebd008e74bb62e.md
View File

@@ -9,7 +9,17 @@ dashedName: step-8
A useful property of an _SVG_ (scalable vector graphics) is that it contains a `path` attribute which allows the image to be scaled without affecting the resolution of the resultant image.
Currently, the `img` is assuming its default size, which is too large. Correctly, scale the image using it's `id` as a selector, and setting the `width` to `max(100px, 18vw)`.
Currently, the `img` is assuming its default size, which is too large. CSS has a `max` function which returns the largest of a set of comma-separated values. For example:
```css
img {
width: max(250px, 25vw);
}
```
In this example, `img` elements will have a minimum width of `250px`. And as the viewport grows, the image will grow accordingly to be 25 percent of the viewport width.
Scale the image using its `id` as a selector, and setting the `width` to to be the maximum of `100px` or `18vw`.
# --hints--