Skip to content
OverviewSolutions
2
Comments
2
Victor Ramos
@rmsvictorz

All comments

  • Victor Ramos•40
    @rmsvictorzPosted over 1 year ago

    Tu solución está excelente David solo tendría una sugerencia para ti, en tu código css, deberías reemplazar todas las unidades de px que es una unidad de medida absoluta por rem que es una unidad de medida relativa, esto hará que tu sitio se adapte proporcionalmente en los casos en lo que el usuario requiera un texto mas grande. el font-size por defecto es de 16px por lo que 1rem equivale a 16px, si cambias el font-size en la etiqueta html por ejemplo a 20px ahora 1rem equivale a 20px aunque lo mas recomendable es dejar el valor por defecto. Existen extensiones de vs code que hacen la conversión del valor automáticamente o puedes hacerlo manualmente dividiendo la cantidad de px que deseas asignar, entre en valor del font-size de html que dijimos que por defecto, el 16px por ejemplo... quieres asignar un margin-top de 35px a tu h1 lo que debes hacer es dividir el valor a asignar 35px entre el valor por defecto 16px que sería un total de 2.1875 y este sería el valor en rem que asignaras a tu margin-top quedando margin-top: 2.1875rem y de esta manera deberías reemplazar todas tus medidas en pixeles

    Marked as helpful
    0
  • Victor Ramos•40
    @rmsvictorzPosted over 1 year ago

    Hola! tu card quedo genial, solo tengo un par de recomendaciones para ti, podrías poner

    min-height: 100vh;
display: flex;
justify-content: center;
align-items: cente;

    a tu body para centrar tu card en la pantalla y eliminar la barra de challenge para darle mas estética a tu componente.

    Lo segundo, sería que cambies las unidades de medida en tu codigo css de px a rem, esto ayudara con la adaptacion de los tamaños de fuente para quien requiera texto mas grande, al principio es un poco tedioso, pero es muy importante para la accesibilidad, una manera muy sencilla de hacerlo es dividir los pixeles que quieras poner entre 16 y pones el resultado en rem ejemplo...

    font-size: 20px

    divides 20/16 que sera 1.25 y le asignas esas medida a font size

    font-size: 1.25rem

    Deberías hacer esto para todas las unidades en pixeles que implementes en tu css

    0