---
id: 5dc23991f86c76b9248c6eb8
title: Hatua ya 6
challengeType: 0
dashedName: step-6
---

# --description--

Katika hatua iliyotangulia, unaweka vipengele vya `h1`, `h2`, maoni na `p` ndani ya kipengele cha `main`. Hii inaitwa *nesting*. Vipengee vilivyokua nested vinapaswa kuwekwa nafasi mbili zaidi upande wa kulia wa kipengee ambacho kimewekwa ndani. Nafasi hii inaitwa indentation na inatumika kurahisisha kusoma HTML.

Kipengele cha `h1`, kipengele cha `h2` na maoni yamejiingiza katika nafasi mbili zaidi ya kipengele cha `main` katika msimbo ulio hapa chini. Tumia upau wa nafasi (spacebar) kwenye kibodi yako ili kuongeza nafasi mbili zaidi mbele ya kipengele cha `p` ili kiwe vizuri pia.

# --hints--

Msimbo wako unapaswa kuwa na kipengele cha `h2` chenye maandishi `Cat Photos`. Huenda umeifuta kwa bahati mbaya, inakosa tagi za kufungua na kufunga, au maandishi yamebadilika.

```js
assert(
  document.querySelector('h2') &&
    code.match(/<\/h2\>/) &&
    document.querySelector('h2').innerText.toLowerCase() === 'cat photos'
);
```

Haupaswi kuongeza vipengele vya `ul` au `li` kutoka kwa mfano.

```js
assert(
  !document.querySelector('ul') && !document.querySelector('li')
);
```

Hupaswi kubadilisha identation kwenye mstari kwa kipengele chako cha `h2`. Tagi yake ya ufunguzi inapaswa kuanza nafasi 6 kutoka mwanzo wa mstari. Unaweza kuanzisha upya hatua ili kurejesha indentation ya asili.

```js
assert(code.toLowerCase().match(/<\/h1\>\s*\n\s{6}<h2>/));
```

Msimbo wako unapaswa kuwa na maoni. Uliondoa maoni kutoka hatua ya awali.

```js
assert(code.match(/<!--.*-->/));
```

Maoni yako yanapaswa kuwa na maandishi `TODO: Add link to cat photos`. Usibadilishe maandishi au nafasi ya maoni.

```js
assert(code.match(/<!--\s*todo:\s+add\s+link\s+to\s+cat\s+photos\.?\s*-->/i));
```

Haupaswi kubadilisha indentation kwenye mstari na kipengele chako cha maoni. Tagi yake ya ufunguzi inapaswa kuanza nafasi 6 kutoka mwanzo wa mstari. Unaweza kuanzisha upya hatua ili kurejesha indentation ya asili.

```js
assert(
  code
    .toLowerCase()
    .match(/<\/h2>\s*\n\s{6}<!--\s*todo:\s+add\s+link\s+to\s+cat\s+photos\s*-->/)
);
```

Msimbo wako unapaswa kuwa na kipengele cha `p`. Umeondoa kipengele cha `p` kutoka hatua ya awali.

```js
assert(document.querySelector('p'));
```

Maandishi ya kipengele cha `p` yanapaswa kuwa `See more cat photos in our gallery.` Usibadilishe maandishi, nafasi, au uakifishaji wa kipengele cha `p`.

```js
assert(
  document
    .querySelector('p')
    .innerText.toLowerCase()
    .match(/see\s+more\s+cat\s+photos\s+in\s+our\s+gallery\.?$/)
);
```

Tagi ya kufungua ya `p` inapaswa kuwa na indentation inayolingana na `h2` yako na vipengele vya maoni. Tagi yake ya ufunguzi inapaswa kuanza nafasi 6 kutoka mwanzo wa mstari.

```js
assert(code.toLowerCase().match(/-->\s*\n\s{6}<p>/));
```

# --seed--

## --seed-contents--

```html
<html>
  <body>
    --fcc-editable-region--
    <main>
      <h1>CatPhotoApp</h1>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->
    <p>See more cat photos in our gallery.</p>
    </main>
--fcc-editable-region--
  </body>
</html>
```

