kątowa 2 Materiał - Jak do centrum Postęp Spinner

Question

I wprowadziły kątowej 2 postępu tarczy z linku poniżej

https://github.com/angular/material2/tree/master/src/lib/progress-spinner

chciałbym mieć to skoncentrowane, jednak jedynym sposobem mogę wydają się uruchom go, aby usunąć z CSS. Powoduje to jednak, że spinner wydaje się ogromny na stronie.

Każda rada byłaby świetna.

Answer 1

wystarczy dodać regułę margin:

<md-progress-spinner style="margin:0 auto;" mode="indeterminate"></md-progress-spinner> 

plunker: http://plnkr.co/edit/sEiTZt830ZE7rqjq9YXO?p=preview

Answer 2

Cóż, trudno będzie Ci powiedzieć, co zrobić, nie widząc generowanych znaczników HTML. CSS jest Twój przyjaciel, a może to strona może pomóc: W3.org

Answer 3

Ten CodePen pomógł mi stworzyć stronę skoncentrowane tarczy z materiałem Design w Kątowymi 4: https://codepen.io/MattIn4D/pen/LiKFC

Component.html:

<div class="loading-indicator"> 
    <mat-progress-spinner mode="indeterminate" color="accent"></mat-progress-spinner> 
</div> 

Component.css:

/* Absolute Center Spinner */ 
.loading-indicator { 
    position: fixed; 
    z-index: 999; 
    height: 2em; 
    width: 2em; 
    overflow: show; 
    margin: auto; 
    top: 0; 
    left: 0; 
    bottom: 0; 
    right: 0; 
} 

/* Transparent Overlay */ 
.loading-indicator:before { 
    content: ''; 
    display: block; 
    position: fixed; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    background-color: rgba(0,0,0,0.3); 
}