diff --git a/curriculum/challenges/english/blocks/workshop-build-a-heart-icon/686daa7ed79ceacd0b264e7e.md b/curriculum/challenges/english/blocks/workshop-build-a-heart-icon/686daa7ed79ceacd0b264e7e.md index 53c44b09e21..d2ba01652fd 100644 --- a/curriculum/challenges/english/blocks/workshop-build-a-heart-icon/686daa7ed79ceacd0b264e7e.md +++ b/curriculum/challenges/english/blocks/workshop-build-a-heart-icon/686daa7ed79ceacd0b264e7e.md @@ -7,12 +7,19 @@ dashedName: step-3 # --description-- -You are getting closer. The next thing to do is to set the `viewBox` attribute of the `svg` element. This will -control how much of the image is visible. The first two numbers set the center of the image. +You are getting closer, now look at this example: -The following two numbers set the size of the image we can see: width followed by height. +```html + + +``` -Since here the entirety of the icon should be visible, you should set the `viewBox` attribute to `0 0 24 24`. +The `viewBox` attribute controls what part of the image is visible inside the SVG. + +- The first two numbers (`0 0`) set the starting position of the `viewBox` — the top-left corner (x and y). +- The next two numbers (`50 50`) define the `viewBox`'s width and height. + +Set the `viewBox` attribute to `0 0 24 24`. # --hints--