P
@lmarchesoti
Submitted
Constantine Tereschenkov
@kdubrovsky
All comments
@kdubrovsky
Posted
Hi there, Lucas! Almost perfect solution! A few things to improve: — you have to control
overflow-xonhtmlandbodytags together to prevent horizontal scrolling on WebKit browsers — try to create main promo block with pure css/html instead of solid png image. It will give you more control and flexibility to get responsive designFeel free to research my solution @ GitHub — it might be helpful.
Marked as helpful
1@kdubrovsky
Posted
Hi! There some thing to improve your solution:
- Try to control overflow-x on html and body tags to prevent horizontal scrolling
- Try to create main promo block with pure css/html instead of solid png image. It gives you more control and flexibility to get responsive design
- Don't forget about box-shadow on courses cards
Feel free to research my solution @ GitHub — it might be helpful.
Marked as helpful
0- Uvejs• 370
@Uvejsii
Submitted
This challenge helped me understand display: flex; and flex direction. All feedback is welcome thank you in advance.
@kdubrovsky
Posted
Hi! Nice work! Let me to highlight two tiny things to improve your solution:
- The button is breaking on ≈570px breakpoint. You should fix button markup and get rid of
padding-left: 27%and make it with justify-content property of flex item - Don't forget — you have to set width of the most of element to 100% at mobile view. Feel free to explore my solution at GitHub.
All the best for you!
Marked as helpful
0 - The button is breaking on ≈570px breakpoint. You should fix button markup and get rid of
This was a fun one! Two things that kinda puzzled me:
-
Did I pull off the image positioning in a correct way? It definitely works, but I don't know if it actually the way to go. Also, when I inspect it in Chrome, the overflow-x:hidden; did not work and there was a horizontal scroll bar. All good on Mozilla.
-
I could not get the height of the cards correct in the Desktop version. I'm sure I am missing something, but couldn't quite figure out what.
Any feedback would be very much appreciated, thank you!
@kdubrovsky
Posted
Hi, Mario! That was a great challenge, wasn't it? ) I'll try to clear for you some things:
- you can fix horizontal scroll by setting
overflow-x: hiddenforhtmltag (check this out) - you might get rid of large image for hero section for pure css/html reconstruction of that statistics and gradient
- cards height is controlled by intrinsic elements size. Check line-heights, font-size and margins there to fix it Wish you the best and feel free to check my solution on GitHub 🙏
0-
- P
@luckyszakul0
Submitted
Hi everyone, I (for now) finished my first project using SCSS. First I was a little frustrated with it but quickly learned some things and the enjoyed the process. I had some problems with overflow-x not working in chrome dev-tools but everything looked alright when I checked the website in firefox and on my phone. If someone encounters any problems please let me know! And of course - all other feedback is greatly appreciated! Have a nice day 💜!
@kdubrovsky
Posted
H, Łukasz! Your work looks almost perfect but there are few thing you can improve:
- You definitly should try to get rid of large image in promo section and reconstruct it with simple html and css. It is great speed and visual quality improvement. (only girl with a cup of tea has to stay as png image)
- There is a tiny bug in Safari (iOS and desktop) with overflow-x: hidden. We have to assign that property for html to prevent horizontal scrolling. Wish you all the best and feel free to check my solution @ my github 🙏
Marked as helpful
0 - Ernesto Acosta• 140
@ernestoacosta1086
Submitted
@kdubrovsky
Posted
Hi! You should use
overflow-x: hiddenonhtmlselector to prevent horizontal scroll in Safari. And it can be more effective and lightweight to create promo block with html and css instead of heavy png. Feel free to research my solution for it.Marked as helpful
1 - AndriiIladii• 80
@AndriiIladii
Submitted
Had some problems with curved background, if anyone have better solution for this please let me know =) I will accept any comments. I'm newbie that just trying to learn =)
@kdubrovsky
Posted
Hi! I used clip-path pseudo element for precise background curves. Let's try it!
Marked as helpful
0
