Issue
Is it possible to have the Angular Material progress spinner appear in-line with the text and roughly the size of a character?
I want something like:
<span>please wait <mat-spinner></mat-spinner></span>
where the spinner just appears in-line with the 'please wait' text.
Is this possible?
I have had a look at the docs and the examples provided but none of them seem to offer a way forward and a Google + search of StackOverflow didn't turn anything up.
Solution
You can use the display: flex
on the wrapping element. To set the size of it, you can use the diameter
input:
<div class="spinner-wrapper">
<span>please wait</span>
<mat-spinner [diameter]="12"></mat-spinner>
</div>
.spinner-wrapper {
display: flex;
align-items: center;
justify-content: center;
}
See a working example here
Answered By - Poul Kruijt
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.