upog
upog

Reputation: 5521

li content styling on hover

I want to update the styling for li content on hover. but only the color is getting applied on hover and the content is not getting updated. any advice please

    li{
        &:hover{
          content: ' ★ ';
          color: red;
        }
      }
      li::before {
        content: ' ☆ '; 

      }

Upvotes: 0

Views: 48

Answers (2)

Jay varmora
Jay varmora

Reputation: 83

li {
  &:before {
      content: '☆'; 
  }
  &:hover {
      &:before {
          content: '★';
          color: red;
      }
  }
}

Upvotes: 1

martinho
martinho

Reputation: 1016

Hmm, you try this?

li {
    &::before {
        content: ' ☆ '; 
    }
    &:hover {
        &::before {
            content: ' ★ ';
            color: red;
        }
    }
}

Check on jsfiddle

Upvotes: 1

Related Questions