Design comparison
Solution retrospective
- I couldn't get the "we're" with the right font-weight.
- I did the mobile version with chrome dev tools and it seems to work right but when i re-size the window manually it doesn't work for me.
Any suggestions are appreciated.
Community feedback
- @MohamedElidrissiPosted about 5 years ago
I notice that you made the heading text uppercase in your HTML, that will make screen readers spell it word by word(as if its an abbreviation), you should apply a
text-transform: uppercase
in CSS instead.1 - @mattstuddertPosted about 5 years ago
Hi Alberto, great work on this challenge! To answer your questions:
- You're currently loading in
300i
for Josefin Sans, which is the italic version. If you remove thei
you'll be loading in the regular collection for thatfont-weight
. - Your media query for mobile is currently
max-width: 375px
, which effectively switches the layout to desktop at376px
or larger. So you would need to increase that breakpoint and have a play around with different values depending on what looks best.
I hope these pointers help. Keep up the great work! 👍
1@AlbertoIJSPosted about 5 years agoThank for the feedback, i'm currently fixing the font weight. I never realized i was importing the wrong one. Since that challenge I've been playing around with the @media query so i'm also fixing the responsive part.
0@AlbertoIJSPosted about 5 years agoAny tips and how to get the gradient? I've tried the linear-gradient but it only gets one color right even though i've found that you can have 2 gradients.
0@mattstuddertPosted about 5 years ago@AlbertoIJS the gradient for the submit? I think it looks fine as it is!
0 - You're currently loading in
- @tomwandererPosted about 5 years ago
Hey there! I was looking at your code and I couldn't find where you put the arrow icon but it still happens right at the submit button. Could you elaborate? Thank you!
0@AlbertoIJSPosted about 5 years agoI fixed that, i didn't even notice that there was an icon for that. Thanks to you i notice there was an svg. I had a ">" as the icon image. I changed it, check it out!
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