mergeStyles can't child (by id) of parent (by class)

Question

For something like the following:


  
    Label text

The following CSS is able to style 'Label text'

.example #label {
  color: red;
}

But it does not work with fluentUI mergeStyles:

const RedLabelStyles = mergeStyles({
  ".example #label": {
    color: "red"
  }
});

I know it's a problem with the selector, not the CSS itself, because the following correctly applies styles:

const RedLabelStyles = mergeStyles({
  "#label": {
    color: "red"
  }
});

user_6118986 · Answer

Was due to the RedLabelStyles selector being applied to the

itself. It works as expected if the JSX is as follows:


  
    
      Label text