Design comparison
Solution retrospective
I would greatly appreciate any feedback you may have!
- Is my
.sr-only
class correct? - Looks like the
border-radius
property is not functioning as expected on the profile picture in Safari. I attempted including-webkit-border-radius: 50%
, but it did not resolve the issue.. What can i do to fix this?
Community feedback
- @FluffyKasPosted over 1 year ago
Hey, this looks great! I don't have a screen reader but your sr-only class seems good (probably it's exactly the same I use actually). I'm on Safari and I don't see any issues with the border-radius. The only thing you missed is the box-shadow on the card, other wise it looks kinda pixel-perfect. Well done :)
1@semperprimumPosted over 1 year ago@FluffyKas I just noticed that the border radius is functioning as expected on mobile Safari, but it seems to be causing issues on macOS Safari. It's quite puzzling 🤔
I appreciate you pointing out the box-shadow. I hadn't noticed it before, but I will make sure to fix it!
Thank you for your valuable feedback!
0@FluffyKasPosted over 1 year ago@semperprimum
Hmm, odd. I'm on my mac and I can't see any problems with your image so I'm guessing blindly here: perhaps try setting a border instead of outline (or perhaps whats being described in this stackoverflow post, but dunno, I've never seen this problem, to be honest)? But yeah, it's just a guess without seeing the bug ^^ Well done anyway :)
1
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord