I have a React form that I need help with. The issue is that I want to reduce the space between the list icon and the label. Here is the CSS I am using:
.form__container {
display: flex;
flex-wrap: wrap;
}
.form__container input {
color: rgb(115, 0, 255);
size: 100%;
position: relative;
flex-wrap: wrap;
width: 300px;
}
.form__container li ul {
flex-wrap: nowrap;
width: 100px;
}
Below is my React component:
return (
<div>
<FormValidator emitter={this.emitter} />
<div >
<form encType='multipart/form-data' action={this.props.form_action} method={this.props.form_method}
className='form__container'>
{ this.props.authenticity_token &&
<div style={formTokenStyle}>
<input name='utf8' type='hidden' value='✓' />
<input name='authenticity_token' type='hidden' value={this.props.authenticity_token} />
<input name='task_id' type='hidden' value={this.props.task_id} />
</div>
}
{items}
</form>
<div>
{validationList}
</div>
</div>
</div>
)
If anyone can assist me with this, I would greatly appreciate it.