Saya punya masalah dengan div. Ini terlihat seperti ini:

<div fxLayout="column" fxLayoutGap="20px">
  <h1 class="mat-display-1">Welcome to $TITLE$</h1>
  <img *ngIf="logoData" [src]="logoData" class="logo" alt="logo"/>
</div>

Semuanya berfungsi dengan baik di chrome dan firefox, tetapi di tepi gambar berubah ukuran tergantung pada panjang tag h1. Berikut CSSnya:

.logo {
 max-width: 300px;
 max-height: 90px;
 display: block;
 width: auto;
 height: auto;
 margin: auto;
}

Dan div:

flex-direction: column;
box-sizing: border-box;
display: flex;

Gambar di tepi seperti: masukkan deskripsi gambar di sinimasukkan deskripsi gambar di sini html css angular

0
Esteban Chornet 13 Agustus 2019, 10:58

1 menjawab

Jawaban Terbaik

Gunakan object-fit: contain; di logo kelas

2
I'm Limit 13 Agustus 2019, 08:05