Flexbox basics
Denna webbplats använder cookies för statistik och anpassat innehåll. Genom att fortsätta navigera på webbplatsen godkänner du denna användning.
Läs mer om cookies här »
JONAS MOLLBERG

Laddar filmer...

Flexbox Tutorial - Flexbox containers

Publicerad 2017-07-12 av Kevin Powell
Längd: 17:31, 21615 spelningar, 748 likes

I have a course all about building responsive websites! It covers everything from the basics to thinking responsively, flexbox and grid and a whole bunch more. Check it out! https://www.kevinpowell.co/learn-responsive

Flexbox has pretty much replaced floats and clears, but there are *a lot* of properties to figure out when you're using it!

This video is the start of a short series looking at how Flexbox works. In this video, I break down the different flexbox properties that we can apply to a container, once we've set display: flex

The full playlist: https://www.youtube.com/watch?v=hwbqquXww-U&list=PL4-IK0AVhVjMSb9c06AjRlTpvxL3otpUd

Here are a couple of really nice flexbox playgrounds, they can be a real life saver! http://flexboxplayground.catchmyfame.com/
http://flexbox.help/

---

Support me on Patreon: https://www.patreon.com/kevinpowell

I'm on some other places on the internet too!

If you'd like a behind the scenes and previews of what's coming up on my YouTube channel, make sure to follow me on Instagram and Twitter.

Instagram: https://www.instagram.com/kevinpowell.co/
Twitter: https://twitter.com/KevinJPowell
Codepen: https://codepen.io/kevinpowell/
Github: https://github.com/kevin-powellom/KevinJPowell

Flexbox Tutorial - Flexbox Items

Publicerad 2017-07-19 av Kevin Powell
Längd: 11:51, 10915 spelningar, 432 likes

I have a course all about building responsive websites! It covers everything from the basics to thinking responsively, flexbox and grid and a whole bunch more. Check it out! https://www.kevinpowell.co/learn-responsive In the last video we looked at Flexbox containers, now we look how we can control the behaviour of individual flex items. I cover flex-grow, flex-shrink, flex-basis, flex, order, and align-self. Here is a nice Flexbox playground, it can be a real life saver! (the old link is dead, but here is a new one!) - https://flexbox.help/ The full playlist: https://www.youtube.com/watch?v=hwbqquXww-U&list=PL4-IK0AVhVjMSb9c06AjRlTpvxL3otpUd --- Support me on Patreon: https://www.patreon.com/kevinpowell I'm on some other places on the internet too! If you'd like a behind the scenes and previews of what's coming up on my YouTube channel, make sure to follow me on Instagram and Twitter. Instagram: https://www.instagram.com/kevinpowell.co/ Twitter: https://twitter.com/KevinJPowell Codepen: https://codepen.io/kevinpowell/ Github: https://github.com/kevin-powellom/KevinJPowell

Flexbox Tutorial - Building a simple layout with Flexbox

Publicerad 2017-07-27 av Kevin Powell
Längd: 11:07, 23305 spelningar, 733 likes

To wrap up the series, I build a simple layout using Flexbox. Nothing too fancy in this, but just showing how easy it makes doing different types of things, and how you can completely change the way the layout looks with media queries.

See the code: https://codepen.io/kevinpowell/pen/xrWKBE

Background blend modes: https://youtu.be/-c94pr41jaI

Here is a nice Flexbox playground, it can be a real life saver! http://flexboxplayground.catchmyfame.com/

---

Support me on Patreon: https://www.patreon.com/kevinpowell

I'm on some other places on the internet too!

If you'd like a behind the scenes and previews of what's coming up on my YouTube channel, make sure to follow me on Instagram and Twitter.

Instagram: https://www.instagram.com/kevinpowell.co/
Twitter: https://twitter.com/KevinJPowell
Codepen: https://codepen.io/kevinpowell/
Github: https://github.com/kevin-powellom/KevinJPowell

Dela sidan:  2019-11-12Jonas Mollberg