I'm attempting to style all the links on my webpage in a particular way, except for those in the navigation bar. Despite trying to exclude the navbar links using a:not(.navbar)
, it seems that the styling still applies to all links, including Link 1
in the navbar:
html:
<body>
<div class=".navbar">
<a href="#">Link 1</a>
</div>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
</body>
css:
body a:not(.navbar) {
font-size: 100%;
color: black;
text-decoration: none !important;
border-bottom: 6px solid red;
}
body a:not(.navbar):hover {
border-bottom: none;
background-color: #80b3ff;
color: white;
text-decoration: none !important;
}