--- id: 5f7692f7c5b3ce22a57788b6 title: Step 44 challengeType: 0 dashedName: step-44 --- # --description-- Per completare lo styling, aggiungi i nomi delle classi `flavor` e `price` a tutti i restanti elementi `p`. # --hints-- Dovresti avere cinque elementi `.flavor`. ```js assert($('.flavor').length === 5); ``` Dovresti avere cinque elementi `.price`. ```js assert($('.price').length === 5); ``` Gli elementi `.flavor` dovrebbero essere gli elementi `p` con il testo `French Vanilla`, `Caramel Macchiato`, `Pumpkin Spice`, `Hazelnut` e `Mocha`. ```js const p = $('p'); const flavor = $('.flavor'); assert(p[1] === flavor[0]); assert(p[3] === flavor[1]); assert(p[5] === flavor[2]); assert(p[7] === flavor[3]); assert(p[9] === flavor[4]); ``` Gli elementi `.price` dovrebbero essere gli elementi `p` con il testo `3.00`, `3.75`, `3.50`, `4.00`, e `4.50`. ```js const p = $('p'); const price = $('.price'); assert(p[2] === price[0]); assert(p[4] === price[1]); assert(p[6] === price[2]); assert(p[8] === price[3]); assert(p[10] === price[4]); ``` # --seed-- ## --seed-contents-- ```html 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 { text-align: left; width: 50%; } .price { text-align: right; width: 50%; } ```