Flexbox Quiz: Pixel Calculations


#1

Hi,

I’m having trouble trying to determine how the pixels are being calculated in the Quiz

Q: Imagine the flex items #alpha, #beta, and #gamma are each 100 pixels wide. How many pixels will separate the first flex item from the beginning of the row if its flex container has the following properties?
.flex-container {
display: flex;
width: 390px;
justify-content: space-around;
}
A: 15px

Q: Imagine the elements #alpha, #beta, and #gamma are 90 pixels too wide for their parent container. By how many pixels will element #alpha shrink if they each have the following flex-shrink values?
#alpha {
flex-shrink: 2;
}

#beta {
flex-shrink: 2;
}

#gamma {
flex-shrink: 2;
}
A: 30px

Can someone provide insight into how the calculation is determined?

Thanks in advance


#2

Maybe reading
https://stackoverflow.com/questions/34753491/how-does-flex-shrink-factor-in-padding-and-border-box
will give you better understanding…


#3

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.