Как изменить размер выбранного компонента в Grommet реагировать JS?

Question

Я создаю форму в интерфейсе, в которой я использую texInput, переключатель, выберите компонент. Все компоненты переключателя texInput имеют один размер в соответствии с выделенным, но размер выбранного компонента очень мал, пожалуйста, помогите мне решить компонент выбора в том же размере, что и для компонента textinput

Answer 1

put your form in a container and override the css of the select component :
css----------------
    .yourClassName{
        width: 100%!important;
    }
html-----------------------
    <Container>
      <Col md={{ span: 6, offset: 3 }}>
      <Form onSubmit={this.onSubmitForm}>
                  <Form.Row>
                    <Col md={{ span: 3 }}>
                      <Form.Group as={Row} controlId="Email">
                        <Form.Label>Email Address</Form.Label>
                        <Form.Control type="email" placeholder="Enter Email" name="Email" 
                           value={this.state.Email} onChange={this.handleChange} />
                      </Form.Group>
                    </Col>
                    <Col md={{ span: 3}}>
                      <Form.Group as={Row} controlId="Name">
                        <Form.Label>Name</Form.Label>
                        <Form.Control type="text" placeholder="Enter Name" name="Name" 
                          value={this.state.Name} onChange={this.handleChange} />
                      </Form.Group>
                    </Col>
         </Form.Row>
         <Form>
      </Col>
    </Container>