17 Replies to “Align Content Vertically (The Standard, Ep. 4)”
Support for this basically stops at IE10, ie9 and lower will need polyfills. http://caniuse.com/#feat=flexbox The better option is always to serve a simpler experience to older browsers
You missed one thing. Setting parent to flex, by default You'll loose width:100%, provided by block property. So width: 100% should be added as the very first property just like fixed height π
That's not really the case, but I always have problem with centering things with css – that's pain in the ass. Few days ago I found this webpage: http://howtocenterincss.com/ it generates minimal css to provide the target. Just thought that someone might find it useful.
Cool, also you can add display : flex to parent, and margin: auto to flex-item (child). The result will be the same, it will be centered by vertically and horizontally. And it just 2 line of code! I'm big fan of flexbox)
Now tell me how to do Pinterest style alignment with just CSS. N Items, each put in the shortest column. (that's the kind of vertical alignment I was hoping for)
Support for this basically stops at IE10, ie9 and lower will need polyfills.
http://caniuse.com/#feat=flexbox
The better option is always to serve a simpler experience to older browsers
Great developers need these useful video series! Thank you very much!
Awesome Series!!
You missed one thing. Setting parent to flex, by default You'll loose width:100%, provided by block property. So width: 100% should be added as the very first property just like fixed height π
hi, need more series
Why unlisted?
That's not really the case, but I always have problem with centering things with css – that's pain in the ass. Few days ago I found this webpage: http://howtocenterincss.com/ it generates minimal css to provide the target. Just thought that someone might find it useful.
Cool, also you can add display : flex to parent, and margin: auto to flex-item (child). The result will be the same, it will be centered by vertically and horizontally. And it just 2 line of code! I'm big fan of flexbox)
Really good.
could u do a video on responsive images? like maintaining the size ratio
Now tell me how to do Pinterest style alignment with just CSS. N Items, each put in the shortest column. (that's the kind of vertical alignment I was hoping for)
This is awesome. talk to point and important thing is very short. So we can get what we want without bla bla. Keep it up. Waiting for new clips.
On video thumbnail, error in the word – "Veritcally". http://prntscr.com/dgvl8h
I use top 50% and transform translate(-50%, -50%) for ie support.
thanks i love your simple yet tasty tips
This is the last video (only 4), and is from December 6, 2016, are you going to make more videos? They're cool!
super like the google T-shirt !π