Task 1: Everything looks good. Task 2: I noticed that you had .container in most of your selectors. What would happen if you got rid of these e.g, #special instead of .container #special ? Task 3: All good here. You get the desired result. However, do you think you can minimize your code by renaming your selectors? Task 4: All looks good here. Task 5: All looks good here.
Hi!
Thank you for assessment and noticing of use of unnecessary “.container”.
If i remove “.container” from the Task1, then it also works, there is no need to use the “.container” because there is only one h1, h2 and span elements in the document.
In Task2, also there is no need to write the “.container” because “#special” alone can work because there is only one id in the document.
Same is the case with “.alert”, “.alert.stop” and “.alert.go”.
In Task3, “a:link”, “a:visited” & “a:hover” alone can work also as there is only one “a tag” element in the document.
Having too complex selectors is an excellent observation by @vusithedev.
Here’s a general recommendation when writing CSS.
Make your selectors as simple as possible.
In real projects you will often need a more specific selector to overwrite a previous one. When you already start with a complex selector you’ll have very complicated selectors in no time.