Techincal documentation page

HTML-CSS
21

alrightio i will add some text to it then
doesn’t fix it but now it has text

<header id = "main">
      getting a bunno
</header>
22

Test #2:

The #getting_a_bunny section is outside of main, so it can’t have the main-section class on it. Use a different class name if you need a class, or just remove that class. It also should be a nav element with the id navbar.

<section class="main-section" id="getting_a_bunny">
...rest
</section>

<nav class="someOtherClass" id="navbar">
...rest
</nav>

Test #4:

It is a bit of an odd requirement and the wording on the test isn’t that great.

Each <section> element with the class of “main-section” should also have an id comprised of the <header> innerText contained within it, with underscores in place of spaces.

It goes like this.

A). Whatever the href value is, the corresponding section id has to match.
B). Whatever the section id is, the corresponding header text has to match.

So, you can’t have this:

<li><a href="#house">Is my house bunny proof?</a></li>

<section class="main-section" id="house">
  <header>Is my house bunny proof?</header>
</section>

It should be this:

<li><a href="#is_my_house_bunny_proof?">Is my house bunny proof?</a></li>

<section class="main-section" id="is_my_house_bunny_proof?">
  <header>Is my house bunny proof?</header>
</section>

If you just do exactly what you did for the first link and its corresponding section and header to the rest of the links and sections/headers you should pass test #4.

You obviously have more tests that needs to pass but this is a start for tests 2 and 4.

1 Like
23

Alright I tried and followed the instructions

test 2 passes now
i removed the class altogether and changed it into a navbar it works

test 4 is still failing me
but they now all have the correpsonding IDs to match and the header text also seem to do so. I copy pasted them and checked them onto errors
https://codepen.io/maria-hoek/pen/mddrVjJ?editors=1100

24

the section id needs to match exactly, including every letter, including case

they do not match in most cases

example:


<section class="main-section" id="do_i_like_bunny?"> <header>Do I like a bunny?</header></section>

the id should be Do_I_like_a_bunny?

also, in a section you should not have only the header but also the paragraphs related to that, in this way you are linking the paragraphs to their header

1 Like
25

The id value does not have to match the case of the header text, but all the letters do have to match (i.e. the missing a is needed).

Also, the id value has to match the case of the related href value so if you do change the id you also have to change the href (otherwise the link will break).

1 Like
26

yes you make scense
and this is what i get from your explanation so far

if the id doesn’t match the two would connect

 <section class="main-section" id="is_a_bunny_right_for_me">

would’t connect to

<li><a href="#is_a_bunny_right_for_me">Is a bunny right for me?</a></li>

(I could’t find a missing a anywhere?)

if the value was is_bunny_right_for_me it would’t be good

then the second part
which seems to be that
id where_to_get? needs to be the same as the header: where to get?

27

  1. You have “do i like a bunny?” for the link text, but the a is missing in the href, id and header text.

  2. The is_a_bunny_right_for_me section header has a question mark (?), the href, id and link text do not.

  3. You have closed each of the .main-section sections after the header, that will make you fail test #5. You have to close each section after the last of the paragraphs that belong to each section.

  4. The nav element should have its closing tag after the closing </ol> tag. You still need to add the id navbar and you have to remove the href attribute from it as that isn’t valid, the same goes for the header inside.

‘href’ is not a valid attribute of the <nav> element.
‘href’ is not a valid attribute of the <header> element.

1 Like