I am using antd's Row and Col components to create a responsive grid. However, when a column wraps underneath due to a breakpoint, there is some clear whitespace (pretty sure caused by gutters) at the end of the line above a shown bellow:
The textfields belong in one row, and the button in another. There is a gutter next to each text field that I want to get rid of so they properly fit the parent's width.
How would I go about doing that? Quick demonstration:
<Row>
<Col xs={{span: 24}}>
<Row>
<Col xs={{span: 24}} ...>
<Input/>
</Col>
<Col xs={{span: 24}} ...>
<Input/>
</Col>
<Col xs={{span: 24}} ...>
<DateRangerPicker/>
</Col>
</Row>
</Col>
<Col xs={{span: 24}}>
<Button/>
</Col>
</Row>
