Files
freeCodeCamp/curriculum/challenges/english/01-responsive-web-design/css-box-model/part-004.md
Nicholas Carrigan (he/him) a563b3b4e4 feat(curriculum): CSS Box Model project (#42182)
* feat(curriculum): add initial steps

Add the initial step files for this project.

* feat(curriculum): write test texts

Add some test text (tests coming soon).

* feat: tests for HTML bits

Add tests for the HTML bits - CSS holding off until parser lands.

* feat: CSS tests

New CSS parser works great!

* fix: link href

Fix the href in the boilerplate.

* chore: apply suggestions from code review

Co-authored-by: gikf <60067306+gikf@users.noreply.github.com>

* fix: clarify link element

* fix: optional chaining

* fix: remove unused meta props

* fix: update helper and fix tests

* chore: apply tom's review suggestions

Co-authored-by: Tom <20648924+moT01@users.noreply.github.com>

* chore: no console logs

Co-authored-by: Shaun Hamilton <shauhami020@gmail.com>

* feat: intro

Add introductory text, tweak instructions a bit.

Co-authored-by: gikf <60067306+gikf@users.noreply.github.com>
Co-authored-by: Tom <20648924+moT01@users.noreply.github.com>
Co-authored-by: Shaun Hamilton <shauhami020@gmail.com>
2021-09-10 17:17:03 +01:00

980 B

id, title, challengeType, dashedName
id title challengeType dashedName
60a3e3396c7b40068ad6996d Part 4 0 part-4

--description--

The content is surrounded by a space called padding, similar to how bubble wrap separates an item from the box around it.

Think of the border like the cardboard box your item was shipped in.

Change the src attribute to https://cdn.freecodecamp.org/curriculum/css-box-model/diagram-3.png

--hints--

The img element should have a src of https://cdn.freecodecamp.org/curriculum/css-box-model/diagram-3.png

assert(document.querySelector('img').getAttribute('src') === 'https://cdn.freecodecamp.org/curriculum/css-box-model/diagram-3.png');

--seed--

--seed-contents--

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Rothko</title>
  </head>
  <body>
--fcc-editable-region--
    <img src="https://cdn.freecodecamp.org/curriculum/css-box-model/diagram-2.png">
--fcc-editable-region--
  </body>
</html>