It takes a while to get used to the idea that CSS can result in seemingly
conflicting instructions.
<style>
button {background-color:cyan; display:block}
.happy {background-color:green; color:blue}
.spacious {background-color:white; padding:20px}
</style>
<button class="happy spacious"> I'm a button! </button>
Without doubt, the button will be:
- On a line by itself
(display:block)
- Spaced out
(padding:20px)
- Have blue text
(color:blue)
- But what will its background colour be ?