I have just reached lesson 32 Learn Typography by Building a Nutrition Label in the RWD Beta and it is asking:
.sm-textelement, create a new
h1element with the text
Calories 230. Wrap the
230portion of the text in a
spanelement with the
I always thought it was bad practise to have more than one H1 tag on a page (as also commented by Kevin Powell in his YouTube video https://youtu.be/NexL5_Vdoq8?t=479). There is already one on line 12 in the code. I haven’t completed the whole project yet but does step 32 need to be revised to make the HTML more semantic?
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Nutrition Label</title> <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700,800" rel="stylesheet"> <link href="./styles.css" rel="stylesheet"> </head> <body> <div class="label"> <header> <h1 class="bold">Nutrition Facts</h1> <!-- There is already a H1 Here --> <div class="divider"></div> <p>8 servings per container</p> <p class="bold">Serving size <span class="right">2/3 cup (55g)</span></p> </header> <div class="divider lg"></div> <div class="calories-info"> <p class="bold sm-text">Amount per serving</p> <!-- The lesson wants another H1 placed here --> </div> </div> </body> </html>