react-bootstrap-table - Scalable Table

I am a beginner in ReactJS and am using the react-bootstrap-table to render the data of an on-screen API.

The code is basically this:

render(){
    return(          
            <BootstrapTable data={this.state.playlist} keyField='_id' striped >
                    <TableHeaderColumn dataField='music'>Name</TableHeaderColumn>
                    <TableHeaderColumn dataField='single_band'>Band or Sigle</TableHeaderColumn>
            </BootstrapTable>
    )
}

In my opinion it is the same as the documentation of lib and also the same as a tutorial, but when rendered in the browser the result is this:

There is no styling in an external file interfering. I would like to understand why the table is getting crooked.