Kevin Price
Kevin Price

Reputation: 429

Material UI nested class override

Im using muiSelect and there is a css selector that im trying to overwrite:

.MuiSelect-select.MuiSelect-select

How can I override this? Ive tried a couple things already like

MuiSelect: {
  select: {
    "& $MuiSelect-select":
  }
}

Which doesnt seem to work

Upvotes: 3

Views: 1091

Answers (1)

brietsparks
brietsparks

Reputation: 5016

Try:

MuiSelect: {
  select: {
    '&&': { ... },
  }
}

This is the line of source code where the default is set (paddingRight: 24px), and the mui theme key to override it is '&&'. I was able to find this by first finding the source code of the native select component, and then searching for the css value that showed up on the dom element I was trying to override.

Upvotes: 4

Related Questions