@xXOsielXx
Posted
Hola. Felicidades por haberle dado solucion a este challenge!
Tu diseño se parece bastante al original; aun asi, quiero darte algunas sugerencias para que mejores tu codigo.
-
Imagen: No necesitas envolverla en un contenedor y centrarla, solo establece esta regla para ella:
img {width: 100%}
, de esa manera tomara todo el ancho del contenedor padre, en este caso, si modificas el codigo seria .card -
Attribution: La atribucion te recomiendo que la saques de la .card. Esto ya es decision tuya, pero en mi opinion se ve mejor afuera, y mas dandole unos estilos personalizados. Por ejemplo, yo lo hago asi:
.attribution {
margin-top: auto;
background-color: inherit;
text-align: center;
padding: 8px;
border-radius: 16px;
z-index: -1;
}
.attribution a {
text-decoration: none;
}
@media only screen and (min-width: 600px) {
.attribution {
position: absolute;
bottom: 0;
}
}
Y estos estilos son fundamentalmente los mismo para todas mis paginas
- Active states: Te falto agregarle los active states a algunos elementos. A mi cuando los hice tambien me faltaron jeje, pero una persona se dio cuenta, me lo dijo y lo corregi. En la carpeta que se encuentra en el archivo que debiste descargar, hay otra carpeta que dice "design" y dentro de esta estan los diseños en los que te debes basar. Una de esas imagenes te muestra los active states que debe tener tu pagina, se llama "active-states.jpg".
Pues eso es lo mas importante, espero que te sirvan mis sugerencias.
Que tengas un buen dia y... Happy coding!