how do you load a css spinner over a react component?

Hei,change it to:


return (
    {this.state.isLoading && <Spinner />}


return (
 <div className={"loader-wrapper"}>
   <div className={"loader"}>Loading...</div>

Also you should modify spinner.css file: Add:

.loader-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;

  display: flex;
  align-items: center;
  justify-content: center;

  background-color: rgba(255, 255, 255, 0.7);

Remove: from .loader remove margin

CLICK HERE to find out more related problems solutions.

Leave a Comment

Your email address will not be published.

Scroll to Top