I am unable to insert an image to my sign up page. I have tried inserting it using index.js (HTML codes in React component) and also in the corresponding CSS file. Both not working. Sharing the codes and screenshot below (I have removed irrelevant import codes):
React Component code:
import styles from "./register.css";
return(
<div>
<div id="styledImg">
<img alt="" title="" src="../../src/assets/bocLogo.png"/>
</div>
</div>
);
}
export default Register;
CSS code:
#styledImg {
width: 1110px;
height: 428px;
height: 428px;
position: absolute;
top: 245px;
left: 87px;
}
#styledImg Img {
max-width: 100%;
max-height: 100%;
}
You have to upload that image as a ReactComponent.
import { ReactComponent as Logo } from "../../assets/your-image.png";
So that should look like:
import styles from "./register.css";
import { ReactComponent as Image } from "../../assets/your-image.png"
return(
<div>
<div id="styledImg">
<img alt="" title="" src={Image}/>
</div>
</div>
);
}
export default Register;