centering preloader in materialize

As long as your container has a declared width and height this will center the element horizontally and vertically. JSfiddle

.loader {
position: absolute;
top :0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
}

Slightly changed the loader's style which helps to remove the issue of showing scrollbar intermittently

<div className="preloader-wrapper big active loader">
    // spinners
</div>

.loader {
  position: absolute;
  margin: auto;
  top: 50vh;
  bottom: 50vh;
  left: 0;
  right: 0;
}