Flex shrink behaviour on images and content

[PaulOB]

@Archibald

I find the images shrink if you include width: 320px; . . . . .or even if you use width: 1px

Ahh ok. Yes I just tested with the width still in place.

I believe what you are running into is that min-width for a flex item has a default of auto which stops the image shrinking. If you add min-width:0 the shrink problem will also be solved.

img {
  flex:1 1 400px;
  align-self: center;
  margin: 10px 30px;
  border-radius: 30px;
  border: 1px solid red;
  min-width:0;
  
}