--- id: 5f716bee5838c354c728a7c5 title: Step 53 challengeType: 0 dashedName: step-53 --- # --description-- Sotto il dessert che hai appena aggiunto, aggiungi il resto dei dessert e dei prezzi usando altri tre elementi `article`, ciascuno con due elementi `p` annidati. Ogni elemento dovrebbe avere sia il dessert e che il testo del prezzo corretti, e tutti dovrebbero avere le classi corrette. ```bash Cherry Pie 2.75 Cheesecake 3.00 Cinnamon Roll 2.50 ``` # --hints-- Dovresti avere quattro elementi `.dessert`. ```js assert($('.dessert').length === 4); ``` Dovresti avere quattro nuovi elementi `.price`. ```js assert($('section').last().find('.price').length === 4); ``` L'elemento `section` dovrebbe avere otto elementi `p`. ```js assert($('section').last().find('p').length === 8); ``` Gli elementi `.dessert` dovrebbero avere il testo `Donut`, `Cherry Pie`, `Cheesecake` e `Cinnamon Roll`. ```js const dessert = $('.dessert'); assert(dessert[0].innerText.match(/donut/i)); assert(dessert[1].innerText.match(/cherry pie/i)); assert(dessert[2].innerText.match(/cheesecake/i)); assert(dessert[3].innerText.match(/cinnamon roll/i)); ``` I nuovi elementi `.price` dovrebbero avere il testo `1.50`, `2.75`, `3.00` e `2.50`. ```js const prices = $('section').last().find('.price'); assert(prices[0].innerText.match(/1\.50/)); assert(prices[1].innerText.match(/2\.75/)); assert(prices[2].innerText.match(/3\.00/)); assert(prices[3].innerText.match(/2\.50/)); ``` Non dovresti avere spazi tra gli elementi `p`. ```js assert(!code.match(/<\/p>\s+

Cafe Menu

``` ```css body { background-image: url(https://cdn.freecodecamp.org/curriculum/css-cafe/beans.jpg); } h1, h2, p { text-align: center; } .menu { width: 80%; background-color: burlywood; margin-left: auto; margin-right: auto; } .item p { display: inline-block; } .flavor, .dessert { text-align: left; width: 75%; } .price { text-align: right; width: 25% } ```