Flexbox и изображения

Question

То, что я пытаюсь выполнить sh, - это создать фотогалерею с помощью flexbox. Я могу заставить изображения выровняться в две строки и четыре столбца, но моя проблема в том, что я не могу управлять размером моих изображений, поэтому они в конечном итоге перекрываются и выглядят ужасно. Я понятия не имею, как решить эту проблему. Я несколько часов пробовал сам устранять неполадки, но плохо разбираюсь в свойствах, чтобы даже сделать обоснованное предположение.

Answer 1

Если вы хотите назначить ширину изображения, вы можете установить flex: none для изображения.

img {
  flex: none;
  width: 33.33%; // or whatever
}

Кроме того, если вы планируете переносить изображения на следующий строка, если места недостаточно, вам нужно установить flex-wrap: wrap в контейнер.

Answer 2

Добавление кода поможет понять, чего на самом деле не хватает.

В любом случае, я бы попробовал это:

.image {
  width: 100%;
}