Hey, only looked very quickly but one point is that you don't need the first media query. Just pop that grid template area line on the container to start with ☺
Design comparison
Solution retrospective
The button I can't seem to get to not cut off the edge of the border-radius? Overflow is set to hidden, which seems to be the most common cause of this according to google. Any tips here v helpful!
Also any pointers on things within the CSS I could simplify much appreciated, there's a few bits that feel like they could have had more elegant implementations.
Community feedback
@RayaneBengaoui
Posted
Hello Fraser Watt,
First of all, congrats for the challenge !
I'm not sure to understand what is your problem, but I guess it's because your border-radius: 5%;
is on your input
while it should be on your div .button-container
. Also, you could add outline : none
to your input to avoid the black border on click.
Let me know if this is what you were looking for ! :)
Overall, well done for the challenge and happy coding ! 😃
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