--- id: 615f84f246e8ba98e3cd97be title: Step 59 challengeType: 0 dashedName: step-59 --- # --description-- Sotto l'elemento `.dbl-indent`, aggiungi un nuovo elemento `p` con il testo `Includes 10g Added Sugars 20%`. Il nuovo elemento `p` dovrebbe essere anche doppiamente indentato e non avere il bordo inferiore. Usa un elemento `span` per rendere il `20%` in grassetto e allineato a destra. Poi crea un altro divider dopo l'elemento `p`. # --hints-- Dovresti creare un nuovo elemento `p` e un nuovo `div` alla fine dell'elemento `.daily-value.sm-text`. ```js assert(document.querySelector('.daily-value.sm-text')?.lastElementChild?.previousElementSibling?.localName === 'p'); assert(document.querySelector('.daily-value.sm-text')?.lastElementChild?.localName === 'div'); ``` Il nuovo elemento `p` dovrebbe avere il testo `Includes 10g Added Sugars 20%`. ```js assert(document.querySelector('.daily-value.sm-text p:last-of-type')?.innerText.match(/Includes 10g Added Sugars[\s|\n]+20%/)); ``` Il nuovo elemento `p` dovrebbe avere l'attributo `class` con il valore `dbl-indent no-divider`. ```js assert(document.querySelector('.daily-value.sm-text p:last-of-type')?.classList?.contains('dbl-indent')); assert(document.querySelector('.daily-value.sm-text p:last-of-type')?.classList?.contains('no-divider')); ``` Il nuovo elemento `p` dovrebbe avere un elemento `span`. ```js assert(document.querySelector('.daily-value.sm-text p:last-of-type')?.firstElementChild?.localName === 'span'); ``` L'elemento `span` dovrebbe avere l'attributo `class` con il valore `bold right`. ```js assert(document.querySelector('.daily-value.sm-text p:last-of-type')?.firstElementChild?.classList?.contains('bold')); assert(document.querySelector('.daily-value.sm-text p:last-of-type')?.firstElementChild?.classList?.contains('right')); ``` L'elemento `span` dovrebbe racchiudere il testo `20%`. ```js assert(document.querySelector('.daily-value.sm-text p:last-of-type span')?.innerText === '20%'); ``` Il nuovo elemento `div` dovrebbe avere l'attributo `class` con il valore `divider`. ```js assert(document.querySelector('.daily-value.sm-text')?.lastElementChild?.classList?.contains('divider')); ``` # --seed-- ## --seed-contents-- ```html
8 servings per container
Serving size 2/3 cup (55g)
Amount per serving
% Daily Value *
Total Fat 8g10%
Saturated Fat 1g 5%
Trans Fat 0g
Cholesterol 0mg 0%
Sodium 160mg 7%
Total Carbohydrate 37g 13%
Dietary Fiber 4g
Total Sugars 12g
--fcc-editable-region--