1
00:00:01,420 --> 00:00:08,680
Hello, in this video, we are going to look at the display property in Bootstrap, so this is a really

2
00:00:08,680 --> 00:00:14,860
cool class that you can utilize to be able to do some really simple but useful stuff.

3
00:00:15,040 --> 00:00:20,290
I will provide a link to the official page that you can check out or the display property stuff with

4
00:00:20,290 --> 00:00:25,780
a bunch of classes on the description of what you can do, but essentially just allow you to modify

5
00:00:25,990 --> 00:00:29,170
the way a particular element display.

6
00:00:29,200 --> 00:00:38,290
So let me show you, if I was to create a div and I have a class of D does inline.

7
00:00:39,200 --> 00:00:49,200
And, you know, that's the displacing, no doubt, and that is a big danger, and if they put on.

8
00:00:54,100 --> 00:01:07,990
So epic Middle East, like so far, said that before we get OK, so we get a limit that spans 12 columns

9
00:01:08,230 --> 00:01:09,570
and he has this text in there.

10
00:01:09,850 --> 00:01:15,430
But if this were the span, it will be what is called an in line element for you for some reason, wanted

11
00:01:15,610 --> 00:01:19,550
to, you know, make it act like a inline solar panel.

12
00:01:19,630 --> 00:01:22,030
But we just put Dash in line.

13
00:01:22,840 --> 00:01:28,840
And if you look, it's only a matter of the takes to contain the content.

14
00:01:29,350 --> 00:01:31,230
And you can also do the opposite.

15
00:01:31,240 --> 00:01:33,190
Essentially, you can.

16
00:01:36,500 --> 00:01:41,510
Sort of formating, you can have the span

17
00:01:46,010 --> 00:01:52,850
and the less refreshed we get a lot of regular span, so that's what we've essentially done with the

18
00:01:52,850 --> 00:01:53,170
death.

19
00:01:54,020 --> 00:01:58,640
But imagine if we want to span, but we want to have it as a block level element or we do.

20
00:01:58,640 --> 00:02:05,860
It could dash block, as you can see, nothing on its Loyn and it isn't on anything else.

21
00:02:06,920 --> 00:02:13,010
OK, so the other property I want to show you is you can apply this to any type of element.

22
00:02:13,390 --> 00:02:22,610
If I have a div, unless I put helliwell here say refresh, save hello world or cool stuff.

23
00:02:22,930 --> 00:02:27,020
Why if we want to just sort of hide it we can just put cloths.

24
00:02:27,620 --> 00:02:36,020
Did not say that unless we took steps to freak out that they don't go below it.

25
00:02:36,040 --> 00:02:38,650
So it's not invisible, it's just not rendering.

26
00:02:38,660 --> 00:02:39,690
It is still there.

27
00:02:40,160 --> 00:02:41,200
Why would you want to do this.

28
00:02:41,210 --> 00:02:47,330
Maybe some concealed components and the user needs to trigger an event, maybe press a button or if

29
00:02:47,330 --> 00:02:53,990
they're on a long form, sometimes you press log in and a bit of text, maybe pops below the, you know,

30
00:02:53,990 --> 00:03:00,050
the text boxes saying, you know, the password needs to be between six and two characters or the password

31
00:03:00,050 --> 00:03:00,650
do not match.

32
00:03:00,650 --> 00:03:03,050
For example, blast off is concealed.

33
00:03:03,230 --> 00:03:04,160
They just have that.

34
00:03:04,160 --> 00:03:05,420
They have it laid out.

35
00:03:05,630 --> 00:03:12,260
And you just essentially remove this cloth in something like JavaScript trajectory, then you reapply

36
00:03:12,260 --> 00:03:13,560
it when you don't want to show it.

37
00:03:13,790 --> 00:03:18,350
So that is the basics of the display property.

38
00:03:18,860 --> 00:03:23,050
There's a bunch here if you want to make it look like an inline block, a table.

39
00:03:23,060 --> 00:03:28,220
So do all the stuff if you want to highlight elements, but also in different sizes as well.

40
00:03:28,430 --> 00:03:35,030
So if you want to only, Heidi, on the largest of screen sizes or if you only want to hide it on small

41
00:03:35,030 --> 00:03:42,710
screen, maybe the content is just too big for, let's say for phone and on all other devices.

42
00:03:43,130 --> 00:03:49,100
You're happy to show a particular content or what you have is depending on what the actual device is,

43
00:03:49,310 --> 00:03:53,720
you might have the content displayed in one way or displayed in a certain way.

44
00:03:53,840 --> 00:03:59,830
And you can do that via high and visibility and you can do display on the print property as well.

45
00:04:00,050 --> 00:04:01,700
That's it for the display property.

46
00:04:02,060 --> 00:04:02,780
Any questions?

47
00:04:02,810 --> 00:04:03,610
As usual?

48
00:04:03,740 --> 00:04:04,430
Let me know.

49
00:04:04,430 --> 00:04:11,120
I will pop my discord on my website in the description you can email me just a normal stuff.

50
00:04:11,360 --> 00:04:14,510
And as usual, I look forward to seeing you in the next video.