简体   繁体   English

如何在索环反应 js 中调整 select 组件的大小?

[英]How to resize the select component in grommet react js?

I am creating a form in the front end In that I use texInput, radio button, Select component.我正在前端创建一个表单,其中我使用 texInput、单选按钮、Select 组件。 All the texInput, radio button component are in one size as per alloted but the select component size is very small please help me to solve the select component in the same size as per textinput component所有的 texInput、单选按钮组件都按照分配的大小设置,但是 select 组件的大小非常小,请帮我解决 select 组件的大小与每个 textinput 组件的大小相同

在此处输入图像描述

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>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM