Material-UI and reactJS components always overlaps each other

I am using Meterial-UI, ReactJS and Bootstrap for the grid mechanism. I have a problem with material-ui, for example, I want to have 4 text-fields in the same row, but no matter what I have tried, they always overlap, even if I have wrapping containers with column class, like in the code below. Anyone know how can I fix this issue?

<div className="row">
                            <div className="col-sm-3">

                                    <SelectField
                                        className="col-sm-3"
                                        value={this.state.value}
                                        onChange={this.handleYearChange}
                                        maxHeight={200}
                                    >
                                        {years}
                                    </SelectField>

                            </div>
                            <div className="col-sm-3">

                                    <TextField
                                        className="col-sm-3"
                                        hintText="Plot Area"
                                    />

                            </div>
                            <div className="col-sm-3">
                                <div className="form-group">
                                    <TextField
                                        className="col-sm-3"
                                        hintText="Base Area"
                                    />

                                </div>
                            </div>
                            <div className="col-sm-3">
                                <div className="input-group">
                                    <TextField
                                        className="col-sm-3"
                                        hintText="Best Price"
                                    />
                                </div>
                            </div>
                        </div>