I am using Divider
as a React Component but it is not getting displayed. I have tried reading the API documentation but I couldn't understand the usage of it and demos. How can this issue be resolved?
This is how it is displayed
Component:
import './styles.css';
import Products from '../../../Assets/Products.png';
import Divider from '../../../../node_modules/@material-ui/core/Divider';
const ProductsSection = () => {
return (
<div className="ProductContainer">
<p>INSTALLED OVER 10 LAKHS STAR RATED PUMPSETS ACROSS THE COUNTRY RESULTING IN A CUMULATIVE SAVING OF MORE THAN 9,000 MILLION UNITS OF POWER FOR THE NATION.</p>
<img id="ProductImage" src={Products} alt="Products" />
<p>Valves - Pumps - Pipes - IoT Drives & Controllers - Wires & Cables - Solar Systems - Motors </p>
<Divider variant="middle"/>
<p>C.R.I. FLUID SYSTEMS PRODUCTS CATER TO DIVERSE SEGMENTS</p>
</div>
)
}
export default ProductsSection;
<hr>
in your DOM? I couldn't reproduce the issue in my codesandbox.<hr>
tag in the DOM.<hr class="MuiDivider-root MuiDivider-middle">
<hr>
?