Css and html issues

  • For a given user property, e.g Age , locate a PARAGRAPH element and give the child SPAN with class prop an HTML attribute of data-age , then set its text value to Age : . The SPAN with class value should have an HTML attribute of data-age-value . The HTML attributes do not need to have a vlaue.

Can some one help

Which challenge is this and what is your current code?

Thanks. The code below
Trying to create a child SPAN

Age:35

    <p><span class="prop" data-height="">Height:</span><span class="value"data-height-value>1.6m</span></p>
    <p><span class="prop"data-weight="">Weight:</span><span class="value"data-weight-value>75kg</span></p>
    <p><span class="prop"data-gender="">Gender:</span><span class="value" data-gender-value>male</span></p>
    <p><span class="prop"data-country="">country:</span><span class="value"data-country-value>Nigeria</span></p>
    <button id="Oracle"class="mdc-button">Calculate BMI</button>
    <div id="outcome"><h5 class="mdc-typography--headline5">BMI</h5><p></p>
    </div>

of which element? you already have spans on all the top p tags. Also, which challenge is this? (You probably can’t post links yet, but the name of it)

Age:35

This is what im trying to solve

  • For a given user property, e.g Age , locate a PARAGRAPH element and give the child SPAN with class prop an HTML attribute of data-age , then set its text value to Age : . The SPAN with class value should have an HTML attribute of data-age-value . The HTML attributes do not need to have a vlaue.

Age:<span class="value"data-age-value>35

Sample of child SPAN

I didn’t find a lesson called “Sample of child SPAN”, but where’s the current code with the age span?

age:20

It’s not wrapped in a span, is that what you’re trying to figure out?

Height:1.6m

what? I’m looking for the full HTML code, not just text. Or are you trying to figure out how to add tags?

[quote=“specs, post:3, topic:282805”]

<p><span class="prop" data-height="">Height:</span><span class="value"data-height-value>1.6m</span></p> <p><span class="prop"data-weight="">Weight:</span><span class="value"data-weight-value>75kg</span></p> <p><span class="prop"data-gender="">Gender:</span><span class="value" data-gender-value>male</span></p> <p><span class="prop"data-country="">country:</span><span class="value"data-country-value>Nigeria</span></p> <button id="Oracle"class="mdc-button">Calculate BMI</button> <div id="outcome"><h5 class="mdc-typography--headline5">BMI</h5><p></p> </div>

Ok, so what are you trying to figure out how to do now?

To
give the child SPAN with class prop an HTML attribute of data-age , then set its text value to Age : . The SPAN with class value should have an HTML attribute of data-age-value . The HTML attributes do not need to have a vlaue.

for AGE, HEIGHT,WEIGHT AND GENDER

Ok, so first you need to make a new p element. Inside, create a span element with a class of prop, and everything it says. Beside it, make another span element with the values it says to have. You already have it for everything except the age, got it?

Please note that

all pairs of SPAN elements are mapped to excatly one user property

Okay, I don’t quite understand that, but can you tell me the challenge link? If you can’t, select it and click the code icon. I think that will work, otherwise you can take a screenshot of it if you like.

The code for the age will be similar to the others, try doing it.

Thanks I appreciate. will continue later

1 Like