Conflicts between selectors

Author: avatarsin

starter/03-CSS-Fundamentals/index.html

@@ -147,7 +147,9 @@ <h4>Related posts</h4>
     </aside>
 
     <footer>
-      <p id="copyright">Copyright &copy; 2027 by The Code Magazine.</p>
+      <p id="copyright" class="copyright text">
+        Copyright &copy; 2027 by The Code Magazine.
+      </p>
     </footer>
   </body>
 </html>

starter/03-CSS-Fundamentals/style.css

@@ -90,30 +90,53 @@ li:last-child {
   font-style: italic;
 }
 
-li:nth-child(even) {
-  /* color: red; */
+li:nth-child(4) {
+  color: red;
 }
-/* Misconeption it doesn't work */
-article p:first-child {
+
+header p:nth-child(3) {
   color: red;
 }
 
+/* Styling links */
 a:link {
   color: #1098ad;
   text-decoration: none;
 }
 
 a:visited {
-  color: #1098ad;
-  text-transform: uppercase;
+  color: pink;
 }
 
 a:hover {
+  color: orangered;
   font-weight: bold;
-  text-decoration: underline wavy magenta;
+  text-decoration: underline orangered;
 }
 
 a:active {
+  background-color: black;
   font-style: italic;
-  background-color: cyan;
 }
+
+.related:hover {
+  background-color: purple;
+}
+
+/* Resolving conflicts */
+
+/* #copyright {
+  color: red;
+}
+
+.copyright {
+  color: blue;
+}
+
+.text {
+  color: yellow;
+}
+
+footer p {
+  color: green !important;
+} */