Css loading spinner with text

.centered {
  text-align: center;
}

.spinner.loading {
  display: none;
  padding: 50px;
  text-align: center;
}

.loading-text {
  width: 90px;
  position: absolute;
  top: calc(50% - 15px);
  left: calc(50% - 45px);
  text-align: center;
}

.spinner.loading:before {
  content: "";
  height: 90px;
  width: 90px;
  margin: -15px auto auto -15px;
  position: absolute;
  top: calc(50% - 45px);
  left: calc(50% - 45px);
  border-width: 8px;
  border-style: solid;
  border-color: #2180c0 #ccc #ccc;
  border-radius: 100%;
  animation: rotation .7s infinite linear;
}

@keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
}

Source: stackoverflow.com

Similar codes

0 vote201 views1 answer
Css grow
CSS
0 vote205 views1 answer
Vue scoped scss media query
CSS
0 vote173 views1 answer
Code css for mozila
CSS
0 vote192 views1 answer
Template html css bootstrap cdn
CSS
39 votes190 views6 answers
Css pointer-events
CSS
0 vote191 views1 answer
CSS adding something next to a picture
CSS
18 votes206 views3 answers
Expo : File C:\Users\Admin\AppData\Roaming\npm\expo.ps1 cannot be loaded because running scripts is disabled on this system. For more information, see about_Execution_Policies at https:/go.microsoft.com/fwlink/?LinkID=135170.
CSS
13 votes188 views2 answers
How to middle text css
CSS
1 vote268 views1 answer
Css spread children horizontally
CSS
0 vote257 views1 answer
Définir le nombre minimum de mots sur les publications WordPress
CSS