1
00:00:01,210 --> 00:00:10,060
Hello, in this video, I am going to cover the float utility in bootstrap, so the float utility allows

2
00:00:10,060 --> 00:00:15,700
you to use classes to essentially change the way the content displays.

3
00:00:15,830 --> 00:00:20,650
They can have a float left, float right or float none and none as well.

4
00:00:20,650 --> 00:00:22,330
No float property.

5
00:00:22,330 --> 00:00:30,760
So I will provide a link to the float page on Bootstrap five and you can check out all the different

6
00:00:30,760 --> 00:00:31,180
classes.

7
00:00:31,180 --> 00:00:35,660
But what you learn here will be applicable to the rest of the classes.

8
00:00:36,040 --> 00:00:47,480
Let's say if I go here and I to Dave and before anything in there, let's say I put a note right on

9
00:00:47,610 --> 00:00:57,480
or site that refresh, it's to the left, to the left of its parent container, which is roughly there.

10
00:00:58,000 --> 00:01:04,510
OK, so but if I was to put the class float dash right.

11
00:01:06,100 --> 00:01:13,930
This school now put it all way to the right all the time relative in its parent content, that is really

12
00:01:13,930 --> 00:01:16,740
cool, but that is on all sizes.

13
00:01:16,750 --> 00:01:17,720
You may not want that.

14
00:01:17,890 --> 00:01:22,510
So let's say if I want something similar, but I only want you on the right on it.

15
00:01:22,510 --> 00:01:24,130
Extra, extra large a size.

16
00:01:24,400 --> 00:01:28,000
So what I can do is I'm going to just duplicate this.

17
00:01:28,000 --> 00:01:29,610
You know what, Elamine?

18
00:01:29,650 --> 00:01:32,170
You apply to what your parent elements are.

19
00:01:32,320 --> 00:01:33,580
You've totally up to you.

20
00:01:33,910 --> 00:01:36,040
And for this float, right?

21
00:01:37,490 --> 00:01:46,450
Only on XXL currently five refresh as soon as we start taking a break point, which we just did the.

22
00:01:47,900 --> 00:01:53,980
It's still on the right, but we want wanted to go back to the left, so all we need to do is provide

23
00:01:54,710 --> 00:01:56,850
a series of XXL dash.

24
00:01:57,000 --> 00:02:01,070
So this means only apply the float right.

25
00:02:01,070 --> 00:02:10,040
Property on this Thalis or do that reload and nothing's changed, but also resides in the window are

26
00:02:10,040 --> 00:02:12,410
triggered the extra large break point.

27
00:02:12,410 --> 00:02:17,480
It's now on the left, unlike the one that's always floating on the right.

28
00:02:17,820 --> 00:02:23,720
And if obviously I refresh and the page is reloaded on a small screen.

29
00:02:23,730 --> 00:02:30,560
So if I start making it big, a big, big, big, big a16, when I hit the extra extra large break point,

30
00:02:30,560 --> 00:02:36,750
it triggered it back to the right so that the rest of the classes, the likes of the left, right and

31
00:02:36,800 --> 00:02:43,640
on, and then there's all these size classes and you can be left, right and non as well.

32
00:02:44,390 --> 00:02:55,190
If, for example, you wanted to put it only on, if a large an extra extra large, you could just put

33
00:02:55,190 --> 00:03:00,380
the extra law in the right property and the large ones so you can combine them as well.

34
00:03:00,380 --> 00:03:02,050
So that's not a problem.

35
00:03:02,060 --> 00:03:03,650
So there's a lot of flexibility there.

36
00:03:04,190 --> 00:03:05,060
Really simple stuff.

37
00:03:05,060 --> 00:03:05,960
The floor properties.

38
00:03:06,150 --> 00:03:11,960
If you have any questions, as usual, contact me on D'Escoto via my website at all the links.

39
00:03:11,960 --> 00:03:13,250
Everything is in the description.

40
00:03:13,250 --> 00:03:17,060
And as usual, I look forward to seeing you in the next video.