Blog-Preview

Community feedback

• 

  Osiel Hernández•190

  @xXOsielXxPosted 5 months ago

  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!

  0