Bagaimanakah Saya Boleh Menambah Margin 1px pada Item Flexbox dengan `flex: 0 0 25%`?

Adakah Terdapat Cara untuk Menambah Margin 1px pada Elemen Flexbox Fleksi yang ditetapkan: 0 0 25%?

Untuk menambah margin 1px pada flexbox elemen ditetapkan kepada lentur: 0 0 25%, laraskan sifat lentur kepada lentur: 1 0 22%. Ini akan menetapkan asas fleksibel elemen kepada 22% (membolehkan empat elemen setiap baris) sambil membenarkan ia berkembang dan mengisi ruang yang tinggal melalui jidar 1px (flex-grow ditetapkan kepada 1).

Berikut ialah contoh:

#foto-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  margin: 10px;
}

.foto {
  flex: 1 0 22%;
  min-height: 50px;
  margin: 1px;
  background-color: red;
}

<div>

Pindaan ini membolehkan margin 1px antara item fleksibel sambil mengekalkan susun atur yang dikehendaki.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menambah Margin 1px pada Item Flexbox dengan `flex: 0 0 25%`?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!