Выровняйте текст названия материала карточки справа - PullRequest
0 голосов
/ 18 декабря 2018

Я пытаюсь выровнять мой заголовок matcard вправо, но css не работает .. почему?

<mat-card [ngStyle]="{ 'margin':'5px','height':'130px'}">
  <mat-card-header>

   <mat-card-title [ngStyle]="{ 'text-align':'right' }">BLABLA</mat-card-title>

  </mat-card-header>

</mat-card>

Ответы [ 2 ]

0 голосов
/ 18 декабря 2018

вы можете сделать что-то вроде этого:

<mat-card  >
<mat-card-header>
 <mat-card-title class="title-card-left"> Test left</mat-card-title>
 <mat-card-title class="title-card-right"> Test right</mat-card- title>
</mat-card-header>
<mat-card-content>
</mat-card-content>

Затем определите некоторые стили для этих классов в вашем css / scss:

.title-card-right{
  display: inline;
  float: right;
}

.title-card-left{
  display: inline;
}

, а затем внутри вашего styles.css

.mat-card-header-text{
  width: 100% !important;
}
0 голосов
/ 18 декабря 2018

Вы можете использовать это

<mat-card style="height:100px;width:300px;display:flex;justify-content:center;align-items:center;">
   <mat-card-content><span>Contents</span></mat-card-content>
</mat-card>

STACKBLITZ DEMO

...