Fylo data storage component using html and css only

Community feedback

• 

  Alamin•2,000

  @CodeWithAlaminPosted almost 2 years ago

  Hi AbdulRhman👋 Great job on completing this challenge! 🥳

  Overall, you did a good job. However, there are a few areas where you can improve your code to make it more efficient and maintainable:

  • In the CSS, you have several long and specific selectors that could be simplified. For example, instead of using .logo ul li img, you could use .logo li img to target the images inside the list items within the logo element. This will make your styles easier to read and understand.

  • In the HTML, you are using the alt attribute for the images, but the values are all empty. The alt attribute should describe the image for screen readers and other assistive technologies, so it's important to provide meaningful values for this attribute.

  • It's generally a good practice to group related styles together in your CSS. For example, you could define all the styles for the logo element in one block, rather than having them scattered throughout the stylesheet. This will make your code easier to navigate and maintain.

  For example:

  .logo {
     width: 350px;
     height: 200px;
     background-color: var(--Dark-Blue);
  
     ul {
     display: flex;
     justify-content: space-between;
     }
  
     li {
     width: 50px;
     height: 50px;
     background-color: var(--Very-Dark-Blue);
     }
  }
  

  Hope I'm 👍helpful!

  Keep up the good work!😊❤️

  Marked as helpful

  1

  ---

  

  AbdulRhman•270

  @Abdo-al-RPosted almost 2 years ago

  @CodePapa360 thank you for your advise

  1

  

  Alamin•2,000

  @CodeWithAlaminPosted almost 2 years ago

  @Abdo-al-R You're welcome! If you have any other questions or need any further assistance, don't hesitate to ask. I'm here to help🤗

  Marked as helpful

  1