Flexbox Tutorial For Beginners: Flexbox Basic Fundamentals | How Flex Layout Works

Опубликовано: 01 Январь 1970
на канале: BookwormHead

Check my article version for more information
►► https://bookwormhead.com/flexbox

Note: properties on flex containers cannot be used on flex items. Vice versa

Flexbox Cheatsheet

How browser read flexbox styles
row flex direction - main axis (horizontal) - left to right
column flex direction - cross axis (vertical) - top to bottom

Flex container:
display:( flex or flex-inline)
flex-direction
flex-wrap - wrap or no-wrap
justify-content - ; (flex-start, flex-end, center, space-between, space-around)

cross-axis:
align-items: stretch; // flex-start, flex-end,center,

Flex items properties:
main-axis
margin-right: auto ( check more changes);
order: ; negative -1 to 0 to positve 1
flex-grow: ; negative -1 to 0 to positve 1 //
flex-basis: example 200px // display flexible width
shorthand: flex: (flex-grow), (flex-basis) ;

cross-axis
align-self: stretch; // flex-start, flex-end,center,

Join My Community! ►► http://bit.ly/divihelp

YouTube SEO Tool
https://www.tubebuddy.com/bookwormhead31

You can grab your Divi discounted lifetime access at http://bit.ly/elegantthemespromo

Sign up for FREE trial on Learnworlds https://www.learnworlds.com?fp_ref=bookwormhead

Business/Sponsorship Opportunity https://share.hsforms.com/19ItYI3b8T-...

Let's Collab! https://share.hsforms.com/1WellVaDZS_...

Looking for freelancers for hire? Maybe, I can help! 🏼‍♀️ ‍♀️
https://share.hsforms.com/1ft4hoOTxQE...

Nice to mee to you digitally! I'm a freelancer who loves to document my discovery either it's a freelancing journey, side hustle and personal improvement.

Note: I only recommend services that I personally use and try. Some of the links in the description are affiliate which means I will receive a small kick back if you convert/purchase.
Let's Connect! 🤩 🤩🤩🤩🤩
Website: https://www.bookwormhead.com/

Subscribe https://bit.ly/3pQKaby
------------------------------------------

Смотрите видео Flexbox Tutorial For Beginners: Flexbox Basic Fundamentals | How Flex Layout Works онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь BookwormHead 01 Январь 1970, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 79 раз и оно понравилось 2 людям.

580