Problem was solved by ensuring that any components were imported AFTER the required CSS files.

Originally, I had imported App.js above the CSS files, and App.js contains all of my imported MDB components. So I needed to move App.js to the position below.

Thank you!

import React from 'react';
import ReactDOM from 'react-dom';
import { HashRouter as Router } from 'react-router-dom';

import '@fortawesome/fontawesome-free/css/all.min.css';
import 'bootstrap-css-only/css/bootstrap.min.css';
import 'mdbreact/dist/css/mdb.css';
import './index.css';

import App from './App';

ReactDOM.render(
    <Router>
        <App />
    </Router>,
    document.getElementById('root')
);

Hi,

It's difficult to find out what causes that behaviour. I tried to run this code with different versions of MDBReact but there were no problems.

You say that classes were added after clicking on the Select, so maybe you have your different classes which override classes from mdb.css file.

What version of MDBReact do you use? Can you try to check if it works with other versions?