i do need some help about the functionality of this application because i dont know how it works.i would really appreciate if someone can explain it for me.Thank you.
Hi @adriantech-beep, What specifically on Functionality front ?
The spacing between items, not too sure but some part in the component seems off which makes the layout on scroll instead of fitting in the page.
Hi Paritch Kaewpradab 👋, I have optimized your post & published both on GitHub & LinkedIn.
GitHub: https://github.com/Skyz03/Frontend-Design-1/tree/main/Social-Proof-Section LinkedIn: https://www.linkedin.com/posts/aakib-z-shah-z-a50b76176_optimizing-css-a-comparative-analysis-activity-7217800314970640384-AT9A?utm_source=share&utm_medium=member_desktop
Hope this is helpful 👍✌️
any feedback is welcome
Hi @abbos, Great work on completing the challenge. It is a great working solution. Few things that could improve your site would be .. could you add a smooth transition for the open and close case.Cause that doesn't seems like sudden open close right now. Also you could look at the generated report to improve your solution. Other than that keep up the good work. 👍
I'm still learning about CSS Grid Layout concepts, so I had some difficulties building the page to match the layout of the design. So, is there an easier way to do the layout desktop (using css grid or not)?
Hi Mariane,
Great work on completing the challenge. There a some other ways to achieve same thing in grids as bunee mentioned about grid template areas.
Here is another official resource from MDN web docs I would like you to refer where all available methods with video explanations plus. A quick go around grid template area is available. Have a look its a good place to start.
Link: https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Grids
That's my trial, I hope to get more reviews.
Hi Mahmoud, Great Solution for this challenge. I really liked your solution on how it works. Just a quick suggestion is that you can disable the hover effect of cards on mobile devices and tablets sizes as well as it does not work. Other than that good job. Keep up the good work in future challenges.
I found really difficult the Hover state in the main image, because I had to deal with two elements. I took me almost half day to complete the code. I would like to receive some recommendations on how to ease the hover state over the texts. And any feedback is welcome to learn some clean code. Thanks to the community ;)
Hi Kirin, Great work on completing the challenge. I had a quick look at your code. Your solution works perfectly. In case you want to improve further I would recommend this W3schools possible way as well: here is the link for similar case: https://www.w3schools.com/howto/howto_css_image_overlay.asp
How can I get the blackDiv (Mobile View) to also be 100% of the view width? I seem to miss something but I don't know what.
Hi Ruandv 👋,
I had a quick look at your code.
The problem in black div for mobile version is you are using paading: 0 10px which is causing the problem.
So that a quick way to fix if you using media queries to target those.
Plus i would recommend more to focus more on mobile design like your footer section and other to make it better.
Keep up the good work 👍!
It was a fun way to learn and exercise CSS Grid. Any feedback highly appreciated :)
Hi Daniel 👋, Really like your CSS grid with it's responsiveness. It pretty cool. Keep up the good work. I think if you use SCSS and BEM. You could really improve your naming in CSS. Here is a quick cheat sheet on BEM: https://9elements.com/bem-cheat-sheet/
Hello, this is my second project using SASS and BEM 👀
• I have a lot of difficulty naming the classes 🥺
Any feedback will be appreciate. 😁💕
I would also recommend this naming BEM cheet sheet to you.
link: https://9elements.com/bem-cheat-sheet/
Hope you find it useful ..
Keep up the good work.
Hello, everybody, this is the new project that I have done, if you can leave a suggestion.
Hi dekidex, Nice work on completing the challenge. I really like your solution along with its responsiveness. But i saw a small glitch with changing the width size from 900 which increases its size dramatically rather than being smooth. I would recommend some media breakpoints use from the Bootstrap size to consider then while applying them. Keep up the good work!
Any suggestions or feedbacks are welcome!
Hi Dwi 👋,
Great work on completing the challenge.
Really like the way you created a responsive design.
Just a quick note, you could start implementing BEM convention to start naming your Css classes plus learn about SCSS from their website.
Drops some tips
Hi vikrant 👋, Great work on completing the challenge, I really like how made things responsive and it works great on most of the devices. My suggestion is it would be better if you name your css using dash "-" or underscore "_" rather than camelCase. Keep up the great work !
Also you could have a look at the report section to improve further.
