UNIDADES EN CSS: REM VS EM VS PX

[@raulgallegos240]

muy claro la neta! tenia esa duda desde hace tiempo, pero nunca le tome tanta importancia , genial ! gracias!

[@sdfsfsfd437]

¡Muy bien explicado! Lo entendí. Muchas gracias.

[@erickrh]

Super claro. Muchas gracias!

[@andrair88]

Para responsive cual sera mas optima?

[@v4ldevrr4m47]

Todo claro. De momento no me toca ir a al documentacion . basto este video :D

[@BBazznOvO]

Excelente video Marcos. Muchas gracias. Mi duda: en otra explicación, leí que se suele confundir la creencia de que EM toma el valor del tamaño de la fuente a partir del elemento padre (justamente lo que tú dices), cuando en realidad comienza tomando su propio tamaño primero, desde ahí hacia arriba. Lo pondré en práctica en este momento y volveré a editar el comentario con los resultados. Saludos! **EDIT** Efectivamente, toma el valor desde el elemento mismo hacia arriba (padres). En el siguiente ejemplo, el elemento tiene un margin-left de 45px (no 30px): html{ font-size: 15px; } div{ font-size: 30px; } p{ font-size: 45px; margin-left: 1em; } Mi texto

[@vidamrr]

Gracias por esa aclaración!

[@nicolasmainer8603]

muy buen video, muy claro..

[@andreurestrep]

Me sirvió tu video, gracias.

[@SonGoku-pc7jl]

genial la explicacion, gracias :)

[@dsalinas81]

Hola, buen vídeo para aclarar conceptos, una pregunta anexa, ¿Que teclado utilizas?

[@RikyToboga]

Claro, clarisa. Buen contenido.

[@alexivarov4189]

Hola me pueden decir si el em en unidad también aplica para el border y width? O solo a ellos se aplica pixeles

[@vidamrr]

Puedes usar em y rem en vez de píxeles en cualquier otro elemento y propiedad, el tema es que típicamente se usan solo para la fuente pero no está limitado a eso nada más

[@alexivarov4189]

@@vidamrr Gracias✌️😊

[@jorgebravosepulveda8400]

Genial Estaba Buscandio Una Respuesta Clara, Porque No entendi nada. Gracias Gracias

[@juan07241981]

Puedes ayudarme con algo,, cual es la diferencia entre selector e ID?

[@vidamrr]

Hola Juan! Selector se llama al elemento que vas a aplicar un estilo, puede ser una etiqueta como img, un Id como #contenedor, una clase como.item o selectores más avanzados como div > p por darte un ejemplo. Si usas Id es porque ese nombre qué asignes va a ser exclusivo, ni va a haber dos, si usas clase es porque ese estilo va a ser usado por más de un elemento

[@eirans]

El ID debe ser un elemento único, es la forma más rápida de encontrar y asignar estilo a un elemento en tu página, pero cuando el mismo estilo lo ocupas en múltiples elementos es mejor usar una clase.

[@ZeR0ByTe]

Gracias amigo por la explicación! Siguiendo los consejos para principiantes, podrías hacer algun video asi como de este tipo para saber bien como ESTRUCTURAR correctamente un proyecto web. Me refiero a q algunos tienen carpeta public, assets, css, cual sería la mejor forma o la que tu utilizas para organizarse mejor. Y por otro lado como hacer para organizarse a la hora de NO REPETIR CÓDIGO. Me sucede mucho en CSS que no se como debo tener un archivo BASE y me la paso repitiendo codigo a medida q voy creando, estaría bueno si puedes eso ya que sería para principiantes tambien y llamaria la atención para los que estamos en este mundo =). Muchas gracias!

[@pineapple20nov]

Cuando le doy un font-size al body el rem no hereda el tamaño del body, pero si le doy font-size al html el rem si lo hereda del html, porque? espero haber explicado bien

[@vidamrr]

el rem siempre va a tomar el tamaño de root y si este no está especificado en la mayoría de los navegadores el tamaño es de 16px. Algo que podría pasar si en body no toma el font size es que quizá tienes otro estilo antes definido o el elemento que quieres que herede ese estilo está heredando otro con más especificidad

[@BBazznOvO]

REM toma de base el tamaño del font de ROOT/HTML. BODY es un elemento hijo de HTML; no son lo mismo.

[@blindcode]

Me sales hasta en la sopa!! Gracias!!

[@serviweb4823]

mejor explicado imposible!

[@Darkar9545]

excelente gracias, pude entenderlo perfectamente. Aunque me parecio raro ver que tome el tamaño del font-size en PX hacia el padding. Pense que deberian compartir el mismo subelemento, por ej Contenedor padre font-size: 2px Padding 1px Contenedor hijo Padding 2em =(2px)

[@vidamrr]

a mi también se me hace muy extraño tener que tomar como base el tamaño de fuente para medidas como padding o margin. Yo esperaría que más adelante exista una propiedad genérica sobre la cual te puedas basar

[@lalocanario243]

gracias me ayudo mucho

[@eivanmtzleal9547]

Gracias! 🤓

[@Paul-zg8fn]

Que es mejor usar px, rem o em?

[@eirans]

Tienes que usar px para definir el tamaño principal en el root, pero a partir de ahí usa em o rem para el resto de elementos. Recuerda que un pixel no tiene el mismo tamaño en una pantalla o en otra, usando em y rem te aseguras que el dispositivo lo muestre del tamaño más cercano a lo que concebiste en un inicio.

[@eirans]

¡Gracias!

[@chalvarenga96]

Hay algo que no me queda muy en claro. En el #container le defines un font-size de 12px pero, el font-size sirve para el tamaño de las letras y en el form le modificas el padding y no el font-size. No logro comprender porque el padding toma el tamaño del font-size si son dos propiedades distintas. Según mi lógica, para que el padding pueda ser relativo al al padding del padre, tendría que ser la misma propiedad. Me está costando esto de las unidades. 😂

[@surprise4222]

Exactamente pienso eso

[@Catto33]

Por que EM y REM sus medidas son igual a los px del Font-Size, ejemplo si en el root: tiene 16px=1rem correcto? Entonces podras usar Margin de 1rem = Margin: 16px | Margin: 2rem = Margin de 32px. Ambos son equivalentes al Font-Size.

[@ospina5367]

Excelente

[@juan07241981]

Buena maestro

[@JUANQUISPE-m5o]

deberian llamarlos rem y fem por root y father cxd