Hi, I'm facing a beginner issue with CSS In the following sample, how can I have link1 use the style in #main and link2 use the style from div2? <html> <head> <style> #main a { color:red; } .div2 a { color:green; } .div2 a:hover { color:blue; } </style> </head> <body> <div id="main"> <div class="div1"><a href='/'>link1</a></div> <div class="div2"><a href='/'>link2</a></div> </div> </body> </html Code (markup): > I'm actually trying to customize a site that already includes the "#main a". I've embedded a new HTML component within a div section that requires custom formatting of links. Ideally without changing anything to existing html/css. Any insights on what I'm missing here is highly appreciated! Frans
It's a simple fix, you just aren't being specific enough with your css. If you change it to this it will work: <style> #main a { color:red; } #main .div2 a { color:green; } #main .div2 a:hover { color:blue; } </style> Hope this helps.