[docs] Add missing justifyContent values and update box styling

[omarmosid]

• I have followed (at least) the PR section of the contributing guide.

Closes: #29050

[mui-pr-bot]

No bundle size changes

Generated by 🚫 dangerJS against 3c10e4b

[siriwatknp]

Everything looks good to me except the styles of the Item in the demo. Can you make it consistent with other demos? (with bg grey and black text)

[omarmosid]

@siriwatknp Sure I can do that but I made the change because @oliviertassinari mentioned it in the original issue #29050

It would perhaps make sense to go ahead and make all the boxes on the flexbox page look like how the boxes on the grid page look. I can make this change as part of this PR (if you're okay with it) or just revert back to the gray ones for now.

Will wait for your confirmation.

[siriwatknp]

@omarmosid Thanks for pointing that out. I think all of the boxes in grey can be converted to blue (similar to grid demos) in this PR! please go ahead with blue boxes.

BTW, Nice work!

[omarmosid]

Thankyou for the feedback @siriwatknp.

I have now updated the PR and added a few missing examples for css properties that can be used for flexDirection, alignItems, alignContent, alignSelf, display, flexDirection, flexGrow, flexShrink, flexWrap, and Order

I have also taken the liberty to add links to the relevent MDN documentation under each property title. Hope that's going to be okay. It's worth noting here that these links open in the same page since they are your normal markdown links and we may want to have them open in a new tab. So I could change:

For more information please see [flex-direction](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-direction) on MDN.

with

For more information please see 
<a href="https://developer.mozilla.org/en-US/docs/Web/CSS/flex-direction" target="_blank" rel="noopener noreferrer">flex-direction</a> 
on MDN.

Again will wait for your confirmation, before making this change.

[siriwatknp]

Again will wait for your confirmation, before making this change.

Sounds good to me, please go ahead.

[siriwatknp]

@omarmosid If you don't mind, I would like to reduce the font-size from 19px to 16px.

[omarmosid]

@omarmosid If you don't mind, I would like to reduce the font-size from 19px to 16px.

No problem at all. Please feel free to let me know in case any more changes are needed 😄

[siriwatknp]

👍 Nice work. Thanks for your first contribution and welcome to MUI community!