Ricardo Cosme Quispe Garcia

@ricardocosmequispegarcia102061
Lima, Peru
Publicaciones
Certificados
Me gusta
Avatar

Pocentajes en Margin y Padding

Avatar

@ricardocosmequispegarcia102061

En el vídeo se menciona que el Margin si es relativo a la altura del papa, haciendo pruebas veo que no es así, les daré los datos.

HTML:

<body>
   <article class="article-1">
       Lorem, ipsum dolor sit amet consectetur adipisicing elit. 
       Eaque laudantium dolores quam, voluptate ipsam numquam 
       doloribus autem. Expedita suscipit labore quasi. 
       Fuga quasi blanditiis distinctio eos enim deleniti eius modi!
   </article>
</body> 

CSS:

[class^="article"] {
   background: yellow;
   margin-top: 10%;
   width: 500px;
}

Teniendo en cuenta el código el <body> seria el papa que tendría el siguiente tamaño 643 x 54 como se puede ver en las imágenes, haciendo los cálculos si mi <article> su margin fuera relativo a la altura del papa tendría un margen de 64.297 x 5.4 pero inspeccionando con la herramienta veo que no es asi y es relativo al ancho al igual que el padding. ¿Esto es correcto o estoy omitiendo algo?. Saludos

Avatar

Diferencia entre ^ y *

Avatar

@ricardocosmequispegarcia102061

Durante el curso entendí que al usar attr^="value" busca que el valor del atributo inicie con el valor indicado, pero si aplicamos esto en el ejemplo del vídeo seria lo mismo, es decir en vez de class*="button--" cambiamos a class^="button--" y tendríamos el mismo resultado, entonces mi pregunta seria ¿cual es la diferencia entre ambos?. Saludos

Dejo un CodePen para que pueda expresarme mejor: https://codepen.io/ricardocqg/pen/GRKVWaZ

Este usuario no ha indicado que le gusta algún video