hover Effect not Working in makeStyles component

[Wahab-Adil]

Duplicates

• [X] I have searched the existing issues

Latest version

• [X] I have tested the latest version

Steps to reproduce 🕹

import { makeStyles } from "@mui/styles"; import { useTheme } from "@mui/styles";

import RevolutionBackground from '../../../assets/repeatingBackground.svg'; const landingStyle = makeStyles((theme) => ({ heading: { fontFamily: 'myfont', fontWeight: 'bold', color: theme.palette.common.blue }, subtittle: { color: 'gray' }, button: { borderRadius: '50px', border: '3px solid blue', '&:hover': { backgroundColor: theme.palette.secondary.light } }, celebrate: { color: theme.palette.common.orange, marginTop: '-20px' }, revolutionBackground: { backgroundImage: url(${RevolutionBackground}), backgroundPosition: "center", backgroundSize: "cover", backgroundRepeat: 'no-repeat', height: "100%", width: "100%",

}, revolutionCard: { borderRadius: 15, boxShadow: theme.shadows[10], position: 'absolute', padding: '6em', [theme.breakpoints.down('md')]: { borderRadius: 0, width: '100%', paddingTop: "6em", paddingBottom: "6em", paddingRight: "0", paddingLeft: "0", } } }))

export default landingStyle;

Current behavior 😯

button: { borderRadius: '50px', border: '3px solid blue', '&:hover': { backgroundColor: theme.palette.secondary.light } },

The above code is used in my makeStyles component but this class is not working nothing happning , i imaging like this class i have not create no result or effect
and also in some sotuations the margin and hover also not working please help what i should do

Expected behavior 🤔

I want to give the hover Effect to my Buttons and also i want to give it margin to my buttons but in my makeStyles component it not working

Context 🔦

This issue is effecting in real time , all of the ceated classes in makeStyle component are working but some of them that has margin or psudo classes it not working ,please Help me ,thx

Your environment 🌎

npx @mui/envinfo

  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

[mj12albert]

@Wahab-Adil Would you mind providing a reproduction? You can fork this template: https://mui.com/r/issue-template-latest

PS: Here are some tips for providing a minimal example https://stackoverflow.com/help/mcve

[github-actions[bot]]

Since the issue is missing key information and has been inactive for 7 days, it has been automatically closed. If you wish to see the issue reopened, please provide the missing information.