Design comparison
Solution retrospective
this is my first web site i done , comment my mistakes and instruct me how to improve it
Community feedback
- @Shiryu790Posted over 3 years ago
I can't really help you, beacause I'm French and saw some videos in French. But you can follow Kevin Powell tutorial about medias queries on YouTube
0@binary01-specPosted over 3 years ago@Shiryu790 thank you I'm so happy some one comment on my solution😀
0 - @Shiryu790Posted over 3 years ago
Hello, the design respects the instructions concerning the size of the cards and their layout in flexbox.
But there are several problems, your design is not adapted to all supports, if you reduce the size of your browser, you will see that your design does not correspond to the size of the screen. So you should start by using media queries to adapt your code to different screen sizes. Then you should create a generic class for the three buttons, such as
<a class="button but3" href="">Learn More</a>, <a class=" button but2" href="">Learn More</a> and <a class=" button but1" href="">Learn More</a>. And from this point on, you start coding in CSS in this generic class several general attributes of the buttons, it will save you from repeating yourself every time you want to style the three buttons.For example, if you write in CSS .button { -webkit-border-radius: 59px; -moz-border-radius: 59px; border-radius: 59px; height: 20px; line-height: 20px; font-family: Arial; width: 118px; font-size: 15px; font-weight: 200; padding: 12px; background-color: #FFFFFF; border: solid #FFFFFF 0; text-decoration: none; display: inline-block; cursor: pointer; text-align: center; position: relative; left:40px; top: 70px; } this will apply to all three buttons and you won't have to rewrite the code several times. And then you add the specific colour of each button in the second class created like this. .but1 { color: #E38826; } .but2 { color: #006970; } .but3 { color: #004241 }
I hope this has helped you, good luck for the rest
1@binary01-specPosted over 3 years ago@Shiryu790 thank you for saying me about media queries , could you where do you learned those stuffs
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