ReactJS样式组件

Question

I'm new to reactjs and I made a component like this:

<Row>
    <Column className="col-8 noPadding">
          <Text value={this.props.description} />
    </Column>
    <Column className="col-4 text-right noPadding">
          <Text {...this.props} />
    </Column>
</Row>

This works fine for me but if I'm using this component (named Autosuggest) I can't style it. I made a .css file (which works on other components) but it doesn't affect my Autosuggest control:

<AutoSuggest className="marginTop" {...this.props.formControlProps} description="test" value="test" />

CSS:

    .marginTop{
    margin-top: 3rem;
}

There is no margin for the Autosuggest control. I tried to change the color but it doesn't work too. Is the only way to style it, if you apply the styles in the component class?

Answer 1

Its solved just added a new property and set the className of the hosting to the properties value. Thanks