Latest solutions
- Submitted 23 days ago
Using SASS for Styling and adding animation
#sass/scss#animation- HTML
- CSS
How to structure my SASS file and How to Name the classes
Latest comments
- @3moor1911Submitted 1 day agoP@Mohammed-Osama-pgPosted about 21 hours ago
Good work you just have to forget to add the top and bottom padding to the main section 128px
Marked as helpful0 - @Ann-grSubmitted 18 days agoP@Mohammed-Osama-pgPosted 17 days ago
Nice work on the design, you also you can let add animation to (:focus) state with (:hover ) state to look good for the keyboard user
0 - @vargasnetoSubmitted about 1 month agoWhat are you most proud of, and what would you do differently next time?
Estou melhorando meus conceitos de html e css, entendendo melhor as relações e organização
What challenges did you encounter, and how did you overcome them?Deixar a imagem do avatar correta e os espaçamento ideal das divs
P@Mohammed-Osama-pgPosted 23 days agoIt is nice work you just need to work more on pixel-perfect design
0 - @SanCross354Submitted about 1 month agoWhat are you most proud of, and what would you do differently next time?
I’m most proud of successfully centering elements using Flexbox and ensuring responsiveness across different screen sizes. Initially, aligning the card perfectly in the center was challenging, but after using display: flex; align-items: center; justify-content: center;, I achieved the desired layout.
Next time, I would explore CSS Grid for layout structuring to see if it provides a more efficient approach, and I’d also focus more on accessibility improvements following WCAG guidelines.
What challenges did you encounter, and how did you overcome them?a. Centering the Card: I struggled with centering the QR code card properly. I overcame this by learning more about Flexbox and using display: flex; align-items: center; justify-content: center;.
b.Ensuring Responsiveness: The design didn’t scale well on small screens at first. I fixed this by setting a max-width for the .card and applying media queries for better responsiveness.
What specific areas of your project would you like help with?a. Improving Code Efficiency: I’d like feedback on whether my CSS structure could be optimized further, such as reducing redundancy or using best practices.
b. Expanding Layout Techniques: While I used Flexbox effectively, I’d like to understand how CSS Grid could be applied for better structure in future projects.
P@Mohammed-Osama-pgPosted about 1 month agothe layout looks good even if it looks a little larger than the screenshot, but it is readable and responsive.
1