Rearrange voting buttons

src/app/components/shared/comment/comment.component.html

@@ -14,12 +14,14 @@
     <button mat-icon-button [disabled]="isStudent" (click)="setRead(comment)" [matTooltip]="comment.read ? 'Mark  as unread' : 'Mark as read'">
       <mat-icon [ngClass]="{true: 'read-icon', false: 'unread-icon'}[comment.read]">visibility</mat-icon>
     </button>
-    <button mat-icon-button [disabled]="!isStudent" (click)="voteUp(comment)">
-      <mat-icon>keyboard_arrow_up</mat-icon>
-    </button>
-    <h4>{{comment.score}}</h4>
-    <button mat-icon-button [disabled]="!isStudent" (click)="voteDown(comment)">
-      <mat-icon>keyboard_arrow_down</mat-icon>
-    </button>
+    <div fxLayout="column">
+      <button mat-icon-button [disabled]="!isStudent" (click)="voteUp(comment)">
+        <mat-icon>keyboard_arrow_up</mat-icon>
+      </button>
+        <h3>{{comment.score}}</h3>
+      <button mat-icon-button [disabled]="!isStudent" (click)="voteDown(comment)">
+        <mat-icon>keyboard_arrow_down</mat-icon>
+      </button>
+    </div>
   </div>
 </mat-card>

src/app/components/shared/comment/comment.component.scss

@@ -38,9 +38,14 @@ mat-toolbar {
   color: #fffde7;
 }
 
-.proffesor-icon {
+.proffessor-icon {
   background-size: cover;
   margin-right: 10px;
   margin-top: 10px;
 }
 
+
+h3 {
+  text-align: center;
+  margin: 0;
+}