10 | CSS FLEXBOX TUTORIAL FOR BEGINNERS | 2023 | Learn HTML and CSS Full Course for Beginners

Подписаться 471 тыс.

Просмотров 24 тыс.

50% 1

Create Layouts Using CSS Flexbox | Learn HTML and CSS | HTML Tutorial | CSS Flexbox Tutorial. In this CSS Flexbox tutorial you will learn how to use Flexbox which is a new feature in CSS. Flexbox lets us align HTML elements in many ways and create layouts using CSS.
➤ TIMESTAMPS
00:00:00 - What is Flexbox?
00:01:08 - What I have so far...
00:02:47 - Create a flexbox container!
00:03:30 - flex-direction
00:05:25 - flex-wrap
00:06:29 - justify-content
00:09:50 - align-content
00:11:49 - gap
00:13:26 - Style container items!
00:13:26 - order
00:14:54 - flex-basis
00:16:25 - flex-grow
00:18:48 - flex-shrink
00:20:02 - align-items
00:21:38 - align-self
➤ GET ACCESS TO MY LESSON MATERIAL HERE!
First of all, thank you for all the support you have given me!
I am really glad to have such an awesome community on my channel. It motivates me to continue creating and uploading content! So thank you!
I am now using Patreon and RU-vid Memberships to share improved and updated lesson material, and for a small fee you can access all the material either from my memberships or Patreon, depending on your preference. I have worked hard, and done my best to help you understand what I teach.
I hope you will find it helpful :)
Memberships: / @dani_krossing
Patreon: / mmtuts

Опубликовано:

17 май 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 31

@FredericPouyet 27 дней назад

Thanks for the videos Dani, the content is very good, very easy to follow, and the explainations are just brilliant.

@raccoonair Год назад

Excellent, thanks for sharing.

@ElementoryMyDearWatson Год назад

Really glad I discovered your channel. Excellent content, clearly and articulately explained with a great presentation style and manner. Many thanks for all the hard work that goes into these. Greatly appreciated.

@miguelolivar999 Год назад

Thanks for the video dani, even though I have a lil knowledge on css styling / layout i look forward to your videos and refresh that knowledge!

@motizilvibes5328 6 месяцев назад

Thank for the teaching , very good 🎉🎉🎉🎉🎉

@boby4751 9 месяцев назад

I like all the videos I have watched from your web dev content, I have watched a lot of other people and I was never able to completely understand, sometimes it to easy it's really hard.

@djfago6240 Год назад

Dani ! Your teaching skills are wow. I have watched 80% of your videos. I am dreaming to ever become a web developer 😅😅. With love from Belgium.

@user-tl9nh2el7v 3 месяца назад

very informative😭😭💯💯

@ameliatan0309 11 месяцев назад

Thanks for this videos. Took notes (on MSWord) like you suggested.

@farah040 Год назад

this is the first video that I couldn't keep up with you, I'll do some reading and come back to it

@Dani_Krossing Год назад

As the lessons go on, I show how to use Flexbox in actual examples, which might be easier to understand 🙂 so you can just skip this for now and return to it later

@ardencone Год назад

@@Dani_Krossing i'd delete this TMI. LOL

@coderswat Год назад

King is back

@tituskizer6478 Год назад

Hello Dani Krossing. Remember that video you made on how to make a player health system? I used it and after a little tweaking it worked great! But you never showed how to make the player die. I tried but I can't figure out how to do it on my own, so can you please show how if you have the time? That would help me a lot. Thank you.

@cyberwired Год назад

This was fantastic thanks, div's always have frustrated me and I've defaulted back to tables so this makes it much easier to understand why they drop down below and not beside each other!

@sydneysolomon5500 Год назад

All your 2023 video are excellent. However there is something missing, which is one video, where you take all your individual videos, which ends up with one video of a an actual website, which if we are stuck, can refer to your individual video for the answer. What do u think?

@phillipdonnelly6430 Год назад

I just use Bootstrap Grid now which works with WP too of course. I couldn't go back to using float and flexbox etc.

@Dani_Krossing Год назад

Using frameworks should always be the end goal when building commercial sites. 🙂 But in a course like this where you are learning HTML and CSS for the first time, it is important to learn how to build sites “manually” to get the understanding down.

@chukwudiconfidence3195 8 месяцев назад

I’m having a problem with when you added new div tags like the repeated 1,2,3 div tags The colors just got bigger and stayed on a line like the purple on a column green on another column same with the last color,it did not follow the flex like the purple color coming after the last color wish is can show you a picture of it😢,it’s making me sad right now sir

@chukwudiconfidence3195 8 месяцев назад

What can I do to make it like yours

@Stoney_Eagle Год назад

Lemme just "flex" my developer lazyness by saying I use tailwind css. 😆 Soo close on getting dark mode, it burrrnnnzzzz, please Dani please make the background dark 😭🤣 What I see many sites not do that offer dark mode by prefers color scheme is making sure their website doesn't flash when (re)loading, to prevent that you can add a style tag in the header that sets the body background to your dark color 😉 Since my React website is a web app that needs to fetch a lot of data from the user to get ready I even included a loading screen with all its styling in the index page, no flashing and the user sees something is working instantly.

@shoo-rts Год назад

20:00

@omerhabib7003 Год назад

Hi... I need your help

@Dani_Krossing Год назад

You are always more than welcome to write a comment asking a question for me or others to answer. 🙂

@omerhabib7003 Год назад

@Dani Krossing need help creating multi div using flex. Is there any email where I can show you the design?

@Dani_Krossing Год назад

@omer habib As soon as a comment says "I need your help", without being followed by the issue, 90% of the time it's because the person wanna get "in touch with me" hehe. 😅 Unfortunately I don't do private interactions with my viewers. 🙂 But you are always more than welcome to describe your issue in detail in the comments.