import React from 'react'
import './Login.css'
const Login = () => {
return (
<>
<div className="container-fluid img-wrapper bg-danger">
</div>
</>
)
}
export default Login
*{
padding: 0;
margin: 0;
box-sizing: border-box;
}
.img-wrapper{
background-image:url(../public/login-bg.png);
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
height:100vh;
}
It looks like you are facing the same issue as in this question: Use images in CSS files with ReactJS
You can add the photo to your public folder, since the server is served there. As provided in this Codesandbox: https://codesandbox.io/s/agitated-turing-gsnr3?file=/src/styles.css