Change Font Weight by value on Roll Over in Menu

Chris3939 · April 26

Hello

Iam trying to change the weight of a font (with available weights) by value on roll over on a menu with drop downs in SS 7.1

I have achieved rollover change with following code when code value is bold, but not when the value is a weight ie 400 etc

.header-nav a:hover{font-weight:200;/*Default font weight*/
}
.header-nav a:hover{font-weight:400;/*Font weight on hover*/
}

Also with transition to bold there is a position shift which Iam unsure is enevitable but with a smaller weight increase would be less noticable

Any help or advice much appreciated

Thank you

Ziggy · April 26

You have the hover state set twice:

Try this code instead:

// Default font weight
.header-nav a {
  font-weight:200;
}
// Font weight on hover
.header-nav a:hover {
  font-weight:400;
}

Chris3939 · May 11

Hello , Apologies for slow response but i dod not see your answer. Thank you for your code corection , much appreciated Chris

Recommended Posts