Intro section with dropdown navigation

Community feedback

• 

  David•8,000

  @DavidMorgadePosted over 2 years ago

  Hello, congratulations on finishing the challenge!.

  I will throw you a few tips that helped me a lot improving my CSS and making me write less and getting the same results.

  1 - Try to use a methodology like BEM, this are conventions on writing classes than can organize your code much better, every time you have a child of a parent, you define it with the name of the parent, two underscores, and the name that you want for example:

  header header__heading header__text header__container main main__image main__paragraph main__prize main__prize--discounted

  You can learn a lot about BEM here.

  2 - Start using pre-processors like SASS or LESS, with this you can write CSS but with super powers, having indentation, variables, mixins... seriously, learning a preprocessor will boost your CSS skills by A LOT.

  3 - Was going to say that you should learn Grid and Flexbox too, but you are using both of them in the project, so keep improving those skills building more complex layout, there are a few here on frontendmentor that can help you improve a lot.

  4 - Try to improve your semantic html, for example, use a image instead of a div with a background image, because for example in this case fits more properly a directly html image. Use sections and articles instead of divs, for example, in this project the left side with the heading and the text, can be clearly a section instead of a div.

  Well but anyway, your project looks pretty neat and is quite responsive so you dont have to worry, just take those projects that have complex layouts to improve your skills.

  Hope my little tips helps!

  Marked as helpful

  1

  ---

  

  Daniel•160

  @DanoSvKPosted over 2 years ago

  @DavidMorgade ´Thanks, I will definitely try to solve more complex layout challenges and I will definitely check BEM. Regarding SASS I have to practice it mote I guess, I feel like I am not efficient enough with it yet.

  1