Prices and Today's Special

Last, the prices and today's special.

The prices are caramel like the headings, so that they stand out from the names. In the lines of the vegan dishes, though, everything stays green, the prices too. Think about which rule wins when two rules set the color of a price.

Today's special gets a caramel background, but a see-through one: only 20% caramel, and the rest is the cream background of the page showing through. The text of the special stays dark brown and fully visible.

The finished menu looks like this (smaller):

Café Whiskers
Coffee, cake and a cat on every chair
Dishes marked with 🌱 are vegan.
Coffee
• Espresso €2.50
• Cappuccino €3.50
• Oat milk latte 🌱 €4.00
Cakes
• Carrot cake 🌱 €4.20
• Cheesecake €4.50
• Apple strudel (sold out today) €3.90
Today's special: carrot cake with a cappuccino for €6.90
Open every day from 8 a.m. to 8 p.m. Find us on the map

That's the whole project. With what you've learned in three lessons, you've given a page its whole look: you've selected elements in different ways, let the cascade and inheritance do part of the work, and written colors in several formats. In the next lesson, Text and Fonts, we'll go back to the cat page and take care of its text: fonts, sizes and line spacing.

Instructions

The prices are caramel, except in the lines of the vegan dishes, which stay all green.

Today's special has a see-through caramel background, 20% caramel and 80% the cream background of the page, and its text stays dark brown and fully visible.

Start programming for free

By signing up, you agree to the Terms of Service and Privacy Policy.

Or sign up with:

3/3