0

I have this on my hover CSS ->

.menu-icon:hover,
.source-icon:hover,
.title h1:hover,
.title h2:hover, 
.list-title h1:hover,
.list-title h2:hover,
.single-content a:hover,
.button:hover,
.pagination .prev:hover,
.pagination .next:hover,
.copyright:hover,
.copyright a:hover {
fill: #e00;
color: #e00;
}

Is there a way to simplify about selecting all link element on hover CSS?

Because I tried *a:hover or * + a:hover but it doesn't work?

  • 1
    Post a [mcve] please. We will need, at a minimum, the relevant HTML – j08691 Dec 05 '22 at 16:44
  • https://angora.id/blog/ – AngoraSpace Dec 05 '22 at 16:46
  • 1
    That's not what I asked. You need to post your [mcve] here. Don't just link to the site that needs fixing — otherwise, this question will lose any value to future visitors once the problem is solved or if the site you're linking to is inaccessible. – j08691 Dec 05 '22 at 16:55

2 Answers2

0

You don't need anything before the :hover if you want to apply the effect to all elements when hovered over. Sadly, this will make the effect apply to everything and is probably what you don't want. I would create a new class in css with the hover attributes and then add the class to all the buttons and elements in your HTML

  .hover:hover {
    fill: #e00;
    color: #e00;
  }
-1

I think you are looking for something like this answer.

With *:hover you are selecting the root element itself. As you want to select every single element, what you are looking for is to select all HTML body's children, for example.

body *:hover {
  fill: #e00;
  color: #e00;
}

Exactly what you are looking for, for linked elements would be:

body a *:hover {
  fill: #e00;
  color: #e00;
}