Vite and tailwind CSS

Community feedback

• 

  Elaine•11,400

  @elaineleungPosted over 2 years ago

  Hi Warren, well done on your first challenge, and welcome also to Frontend Mentor 🙂

  This is excellent work, and your solution looks really good; I like how everything is structured and written, just very clean in general, and so it was hard to find something to suggest. The only comment I have is, if you hover over the <picture> node element in your browser's inspector, you may see a bit of a spacing under the image, and I believe because picture may also be an inline element like img, which means it will need a display:block to get rid of the space. I see that you have some reset/base CSS rules for img and other media sources; you may want to add picture in there as well.

  Great job Warren!

  Marked as helpful

  0

  ---

  

  Warren•630

  @warrenleePosted over 2 years ago

  Hi @elaineleung thanks for the feedback! And thanks for the tip on the picture tag will check that out on my side. I also did a bit of snooping on your solution and was interested to see your approach. I saw you sometimes separate your classes with a / is that something from Cube CSS you mentioned in your solution?

  1

  

  Elaine•11,400

  @elaineleungPosted over 2 years ago

  @warrenlee Hey Warren, yes, the slash is just what I use for separating classes, which comes from Andy Bell's CUBE CSS approach, although he uses square brackets. Kevin Powell has a video series recently where he coded up a FEM challenge using CUBE CSS also, and he uses the upright slash. I'm still a noob in using it though 😅

  I haven't gotten around to learning Tailwind yet since I'm still very much into writing everything out with CSS, but just looking at your code and end product I felt you probably have a good level of proficiency in it!

  0

  

  Warren•630

  @warrenleePosted over 2 years ago

  @elaineleung I see! The class notation is readable and clean! Will try this out sometime.

  Yes I have been using Tailwind for over 3 years! I use to use Twitter Bootstrap, but Tailwind is a game changer because you can customize on the fly and treeshakes the CSS file to only leave in the styles that you actually use.

  0
• 

  Bismarck Momanyi•200

  @AbcmahPosted about 2 years ago

  nice work, you are really good in this, the out my solution

  1

  ---

  

  Warren•630

  @warrenleePosted about 2 years ago

  @Abcmah Thanks man appreciate it!

  0

  

  Warren•630

  @warrenleePosted about 2 years ago

  @Abcmah Thanks man appreciate it!

  0