1
00:00:00,390 --> 00:00:04,560
Veamos en este video a darle un poco de estilos al programa del evento.

2
00:00:04,950 --> 00:00:14,250
Queremos que esta sección esté sobre el video y para eso vamos a utilizar posiciones absolutas y relativas

3
00:00:15,650 --> 00:00:23,940
así que por eso hemos creado tantas dips y tanto contenido para hacerlo un poco más fácil y voy a hacerlo

4
00:00:23,950 --> 00:00:28,590
un poco más grande del código y un poco de scroll.

5
00:00:30,020 --> 00:00:40,100
Aquí vamos a colocar un comentario que diga talleres o bien podría ser el programa del evento el padre

6
00:00:40,100 --> 00:00:46,660
de todo esto es el section programã así que le podemos Seixo un programa y esto lo vamos a poner en

7
00:00:46,660 --> 00:00:47,770
posición relativa.

8
00:00:48,790 --> 00:00:55,010
Si recuerdas en la parte de posición relativa y absoluta el padre debe estar en relaté para que el hijo

9
00:00:55,010 --> 00:01:07,500
pagos podamos darle un absoluto y vamos a utilizar el dip contenedor video y éste lo vamos a poner Max

10
00:01:07,610 --> 00:01:19,970
with irás a poner mi suite 100 por ciento y yo no overflow iba a ser un overflow X y esto es para en

11
00:01:19,970 --> 00:01:26,800
caso de que el video se salga no permita recorrerla un poco más.

12
00:01:26,800 --> 00:01:35,530
Igual aquí le podemos poner video with 100 por ciento el problema de hacerlo así es que cuando lo hagan

13
00:01:35,560 --> 00:01:44,020
muy pequeño el video se va a perder así que por eso decidí hacerlo de esta forma igual a quien nos va

14
00:01:44,020 --> 00:01:47,990
a permitir más grande ver un poco más de contenido.

15
00:01:49,430 --> 00:01:56,160
Vamos a continuar y aquí tenemos el contenido del programa este será el que posicionara más absoluto

16
00:01:56,580 --> 00:02:08,480
para colocarlo esta parte aquí arriba de contenidos programa y vamos a ponerle un sillón Absolut

17
00:02:11,680 --> 00:02:27,600
top cero cero alto Jaitt 100 por ciento ancho 100 por ciento y recargamos y vemos que se coloca de esta

18
00:02:27,600 --> 00:02:35,020
forma ya está tomando el contenido del video se coloca arriba del

19
00:02:38,240 --> 00:02:40,570
vamos a continuar y vamos a poner aquí.

20
00:02:41,870 --> 00:02:49,850
El siguiente es este programa del evento y vamos a ver si se ve en el diseño aquí puedes ver que tiene

21
00:02:49,850 --> 00:02:58,580
un color de fondo blanco sin embargo se ve un poco de transparencia así que podemos utilizar RGB a bacana

22
00:02:58,750 --> 00:03:11,280
un color RGB a y le ponemos 2:55 en todos y en el último no ponemos un punto 8 guardo cambios y recargo

23
00:03:11,280 --> 00:03:21,480
y va a ser difícil ver si se alcanza a ver en esta parte como la mano toma el color transparente que

24
00:03:21,480 --> 00:03:31,970
funciona bien osaban Padín de 15 píxeles recargamos te lo va a dar un poco más de hacia adentro del

25
00:03:32,180 --> 00:03:33,360
contenido.

26
00:03:33,560 --> 00:03:40,010
Sin embargo puedes ver que el diseño a quienes no toma el 100 por ciento del ancho aquí sí lo está tomando

27
00:03:40,490 --> 00:03:42,380
o cerca.

28
00:03:42,460 --> 00:03:48,650
Así que podemos ponerlo dentro de un media query en móvil está bien cuando estemos en móvil queremos

29
00:03:48,650 --> 00:03:54,320
que tome todo el espacio pero en una pantalla grande queremos que nada más tome la mitad.

30
00:03:55,480 --> 00:04:07,880
Podemos copiar este medio Cuadri pegarlo aquí y ponemos Dib programa del evento y vamos a ponerlo un

31
00:04:07,880 --> 00:04:11,360
ancho de 70 por ciento esto para una tableta.

32
00:04:11,420 --> 00:04:23,270
Puedes ver que 7 6 8 y copió este también y lo pego cuando sea 992 una laptop o una computadora de escritorio

33
00:04:23,860 --> 00:04:29,930
toma el 50 por ciento recargamos y vemos que ya nada más toma la mitad.

34
00:04:30,050 --> 00:04:36,010
Igual aquí es difícil ver pero podemos ver que sí lo está tomando

35
00:04:39,990 --> 00:04:41,420
y inspeccionada aquí.

36
00:04:41,420 --> 00:04:49,280
Además para ver algo donde está posicionado si vemos que exista así que quiere por ejemplo en el programa

37
00:04:49,280 --> 00:04:59,060
de eventos esperamos poder poner un margen top de 50 píxeles recargamos y eso lo va a centrar un poco

38
00:04:59,060 --> 00:04:59,600
más

39
00:05:05,850 --> 00:05:12,030
pero es un poco más unos 80 píxeles recargamos y creo que se vería mejor.

40
00:05:12,040 --> 00:05:13,780
Es que el vídeo terminó siendo muy grandes.

41
00:05:13,780 --> 00:05:14,740
Un vídeo en HD

42
00:05:19,950 --> 00:05:26,670
que se ve bien ahí así que en el siguiente vídeo vamos a darle estilos a la parte de adentro de este

43
00:05:27,210 --> 00:05:35,370
programa de eventos ya nos estamos acercando vamos acercándonos poco a poco a la meta.

44
00:05:35,480 --> 00:05:38,580
Que en el siguiente vídeo vamos a finalizar esta parte.