+ 2

Why does some code affects others even after the closing tag.

For example, in the code below i want to make one img border green and the other black, but it just takes the most recent setting and applies it to all img. How can i solve this problem? <!DOCTYPE html> <html> <head> <title>Page Title</title> </head> <body> <style> img { border: 5px solid #51BE00; } </style> <img src="https://assets-prd.ignimgs.com/2022/08/17/top25animecharacters-blogroll-1660777571580.jpg" hight="100%" width="70%" alt="Example Image"> <style> img { border: 5px solid #51BE00; } </style> <img src="https://assets-prd.ignimgs.com/2022/08/17/top25animecharacters-blogroll-1660777571580.jpg" hight="100%" width="70%" alt="Example Image"> </body> </html>

11th Dec 2022, 12:07 AM
Praise Onyemenam
Praise Onyemenam - avatar
2 Réponses
+ 1
Your css seems to be targeting the img tag, so it will change all image in the html code You should be using classes to target specific items within the document. <style> .greenBorder { border: 5px solid green; } .blackBorder { border: 5px solid black; } </style> <img class="greenBorder" src="..."> I hope this helps :)
11th Dec 2022, 3:40 AM
Apollo-Roboto
Apollo-Roboto - avatar
+ 1
Thanks bro, it worked💪👌
11th Dec 2022, 4:08 PM
Praise Onyemenam
Praise Onyemenam - avatar