Estamos de vuelta con el proyecto de bienes raíces y estaremos construyendo así que primero voy a hacer
espacio aquí iba a hacerlo más pequeño.
Entonces ver que es un desastre este proyecto en cuanto a responsivo se refiere puede ser que estas
partes también amontonada aquí se ve bastante mal pero bueno igual no conocíamos los Aquaris probablemente
ya los conocías pero en cuanto al material del curso no los conocíamos como tal el primer paso y aquí
está el no vamos a tocar nada de HTML únicamente lo que viene siendo el CSS esta parte de arriba nos
la vamos a tocar es solamente la configuración aquí nos permite tener imágenes responsivo entonces se
queda como está.
Si recuerdas anteriormente lo que era el contenedor en las orillas entonces aquí está tenerun Wit del
95 por ciento que hace que tengamos un poco de espacio en las orillas y hace que se vea bien estos Kering
se mantienen como están.
Esta sección también las utilidades se mantienen como están poco más de scroll.
Ahora por ejemplo este botón aquí vamos a empezar a hacer ajustes puedes ver que por ejemplo en el proyecto
del café los botones tomaban todo el espacio disponible en lo que vendría siendo ya un dispositivo más
grande si son más pequeños por lo tanto aquí vamos a poner display Block en todo el espacio disponible
y si recuerdas algunos van a ser hijos de elementos flexibles.
Por lo tanto cero cero 100 por ciento si esto va a hacer que crezca lobatãn estos no crecen porque están
atorados por así decirlo gracias al Grit pero enseguida los vamos a arreglar.
Y después de esto vamos a colocar de acuerdo ya tenemos nuestros Neopets 7 6 8 pixeles botón Button
y display Block Block para que tome bien lo que es de los Mariinski y también los padres y finalmente
Flex cero cero auto en caso de que sean hijos de Flex avanzar un poco más escrotal toda la parte del
Jaider esto se mantiene como está.
Lo que si vamos a tocar un poco es la barra puedes ver que nuestra barra está uno a la izquierda a la
derecha entonces la idea es que esté el logo arriba y lo que viene siendo la navegación abajo.
Entonces para empezar todo esto va a estar dentro de un Miria QWERTY entonces MQ MQ 7 6 8 pixeles todo
lo que está aquí a excepción de este top va dentro del cuerpo para que nada más se aplique Flex Books
en este tamaño.
Por lo tanto quitamos éste y quitamos estos tres si guardamos cambios pues el que se ve de esta forma.
Aquí por ejemplo vamos a tener que dar un poco más de color hacia arriba porque por ejemplo en el móvil
me gustaría que todo el texto estuviera centrado entonces Text Line Text Line Center se va a centrar
todo incluso el logotipo puedes ver lo que lees siendo la navegación orientada a corregir la navegación
y también esto aquí por lo tanto Sopra Arquímides QWERTY 7 6 8 pixeles y más contenido Jaider y tener
un texel Line Leff para que el contenido se vaya a la izquierda cuando estemos en un dispositivo más
grande del que queda estaforma y pequeño queda de esta forma.
Si continuamos por ejemplo en esta parte de aquí este menú me gusta como se ve en realidad pero a ser
muy pequeño ya en un teléfono esta pantalla se ve grande aquí va a ser muy pequeño en un teléfono para
darle click y presionar tal vez queramos acceder al blog y demos por error aka lo vamos a solucionar
aquí por ejemplo vamos a poner un display Blok display Blok que se va a ser que todos los anuncios y
cada uno de los enlaces tome una línea y por lo tanto aquí voy a poner un media Codeni Miyako 7 6 8
pixeles usualmente yo empiezo a hacer los break points a partir de una tablet por eso hemos utilizado
muchos 7 6 8 sorprende display inline Block para que vuelva a su posición.
Entonces si lo haces más grande puede ser que vuelva a su posición y pequeño que de esta forma ahora
queda desalineado no se ve así como en curva los enlaces es por este margen Riet.
Por lo tanto aquí tendremos que copiar y poner aquí márgen right después que de esta forma queda ahora
por ejemplo aquí el último es el que tenemos Last of Taipe este también tendría aquí dentro de su propio
mira Cuadri para que solamente aplique cuando estemos en un tamaño más grande de esta forma quiere ver
removerlos que es el margen a la derecha después ver lo bien que se ve más fácil de acceder a los elementos
puedes hacer más grandes 2 por ejemplo digamos aquí 6 acortar éste te está bien para el escritorio Funza
es 2.2 y aquí por ejemplo Foncea es 1.8 Rubem entonces va a ser más grande la fuente y aquí va a ser
más pequeña entonces esta parte ya está lista si damos un poco de scroll puede ser que los iconos también
no se ven muy bien el scroll que aquí aplicamos Flex Books lo ideal va a ser rodear todo esto economía
Cuadri la cuenta 7 6 8 y voy a cortar este aquí con nosotros se van a aplicar únicamente en Ermida QWERTY
y por ejemplo también aquí lo que es el ancho.
Vamos a poner aquí punto y de hecho esto más bien por la forma en que me gusta me escribiros de Aquaris
tendría que ser aquí abajo 7 6 8 y no y este lo voy a cortar y me lo llevo para acá.
Escribir de esta forma más bien a mi me gusta y Rós declarando por ejemplo el que es móvil First y que
aplica a todos y luego después el ser mi descubri así lo voy aplicando siempre y por ejemplo cuando
cupa hacer ajustes encuentro lo que viene siendo todos los estilos agrupados si crearás grandes bloques
de media covering como en muchos lugares recomiendan además de que no es recomendable por el hecho de
que lo que ya vimos que el usuario vería una versión móvil y después la versión completa tendrías que
estar haciendo mucho scroll para arriba y para abajo y eso eso no es muy bueno si llega a ser un poco
cansado estar ubicando los electores en distintas partes.
Por eso a mi me gusta esta forma para que todo está agrupado si hacemos esto grande puede ser que si
se muestra bien pequeño se muestran uno arriba del otro.
Vamos a continuar el siguiente vídeo con casas de en venta y lo demás de esta página.
Así que continuamos en el siguiente video.