You probably dont give a shit but does anybody know a tool to get back into an instagram account? I was dumb forgot my login password. I love any tricks you can give me
It's weird because I feel I have read about 'Flex' endlessly and watched heaps of videos and still never really 'got' it... but having watched your first two videos with examples.... things are really starting to fall into place! I would love to see a few 'real life' examples of actual content with the various Flex grow/shrink/basis being used as 'Designing' isn't one of my fortes and I often get stuck with laying out content in a visually stimulating way! :) Thanks Kevin ;)
You are a really rockstar when it comes to website building. I think you are a fantastic educator here in RU-vid and the hole community is very lucky to have someone like you who explains very deeply on specific topics.
Thanks, Kevin! I am so grateful for these tutorials; you have no idea... I had the basics of HTML for years, but I always used divs to center things on my website. Now, this flexbox is like... magic. I want to learn coding, so I started from teh bottom. There's a long road ahead for me, but I'm determined to keep going, keep improving every day, cause I want better things in life. 5am and I'm still learning. Stay up, kings!
that guy is awesome he has a way to teach things, I've always went into CSS Grid because seems like better, but in fact, the Flexbox works very well, we need to understand it, I'm not telling to anyone stop to use CSS Grid, each one of them has the better time to be at scene, what I'm trying to say is that right now I just look Flexbox in a very nice better way that before to know Kevin Videos... :)
Amazing, now I understand how flex-basis and flex-grow work. Thanks for your work. It would be nice to see how to use it in a common post grid of any blog theme or html template. :)
Thanks ! Nice explain and example of flex 1:48 flex-grow default is 0 2:20 flex-shrink default is 1 2:25 flex-basis describe how much space it want to take 3:47 flex-grow: 1 grow to fill space (even if you fixed size) 5:06 flex-shrink shrinking faster 6:28 flex: grow shrink basis 8:35 align-self align only it self 9:24 order change order of item
Interesting videos; I'm going to include some code in my comment dealing with flexbox that I don't see anyone addressing. With just a few lines of code you can produce flexboxes that are self-responsive (no media queries required) and designed to follow the Golden Ratio.. flex-container { display: flex; flex-flow: wrap; width: 100%; } .flex-col-sm { flex: 1 1 38.2%; min-width: 18.33rem; } .flex-col-lg { flex: 1.61803 1.61803 61.8%; } note, the min-width is what creates the responsive break. Hope you find this interesting.
Nice, thanks for sharing that! The only problem I could potentially see is the small column being a lot bigger than the large column, but a media query to have them stack would take care of that :)
Setting the flex-flow to wrap has the same effect as a media query; when the browser reaches the min-width of the smaller column the columns wrap and fill the container 100%; you would want to set different min-width if you were nesting the columns.
daym..... if u change flex-shrink .... it grows at the same rate as it shrinks under that mentioned 250px if u change flex-grow.... it shrinks at the same rate as it grows after that mentioned 250px they must rename it as.... flex-more-space-available-accelerations for flex-grow flex-less-space-available-accelerations for flex-shrink.... cause they both change the acceleration speed of both growing and shrinking......just under different situations.... (i was just kidding about that renaming thing....)
Hi @Kevin, I really enjoy your tutorials and they helped me figure out a lot of things or simplify/improve old code I was using. However, using flex, what I don't quite understand is how to stack a set of 6 divs side by side into a set of 3 or 2 or 1, based on the available horizontal space. Do you have any tips for this?
Hello @kevin its nice, but how it will work if the 9 item is there and it has 20px margin. i was faced issue with card ui. because i have a margin to item, and there is remaining space in right side on some of resolution. can u please make card layout sample in flex with margin to item like 20px. it should be not break on any browser and it should be grow with grid layout on all resolution thanks :)
Nice video sir and 1 request sir please make a video how to set payment option in WordPress eCommerce website like how to set pay pal,pay u money and cash on delivery
I would look into a Stripe plug-in, or something more comprehensive such as WooCommerce. I wouldn't set up my own payment system, way too much work, and a potential security risk.
I think the Grid is *incredible*, but it's support isn't really here yet (I know it's supported by all the browsers now, but caniuse has worldwide support at only 70%, thanks to people using old browsers caniuse.com/#search=css%20grid ). That said, they work really well together! You can set up a nice layout with the Grid, and then use flexbox inside the grid, specially since the subgrid isn't here yet. I do think flexbox still have a huge part in design, and until browser support improves (and people learn the grid better), it's still going to be the primary way of building layouts for a little bit longer as well. Eventually, Grid will be more for layouts, supported by flexbox within the Grids we build.
Consider flex-basis a pivot value around which items either shrink or grow if it is possible. The flex property is observable clearly only when there is nowrap.
Thanks for the great tutorial. By the way, of course your tutorials are great, but practice makes perfect, doesn't it? I've been playing on that flex playground to practice what I've learned from you. Thanks for sharing it too.
Hi @Kevin thanks a lot for the great videos you create. It helps a lot! Could you tell me where is the difference between "display: flexbox" and "display: inline-block" for me both do almost the same -align elements in a row . So, I'm confused when I need to use the second one.
