Any feedback is appreciated! Thank you!
What challenges did you encounter, and how did you overcome them?To display different images for mobile and desktop screens, I have utilized the element.
What specific areas of your project would you like help with?Any feedback is appreciated! Thank you!
Built this card using CSS customs properties, flex and grid. My image placement in the desktop view might be a bit unorthodox, lol. Reviews and feedback would be appreciated.
Hi @AyomideKayode Here are some suggestions to help improve your code:
This challenges requires the use of two images 🎑 for different breakpoints. The picture element will facilitate this. Here is an example of how it works: EXAMPLE
Syntax:
<picture> <source media="(min-width: )" srcset=""> <img src="" alt=""> </picture> More Info:📚https://www.w3schools.com/html/html_images_picture.asp
The only heading in this component is the “Get insights that help your business grow” everything else will be wrapped in a paragraph element. The statistics at the bottom are a list, so it should be built using an unordered List element. More Info:📚
MDN <ul>: The Unordered List element
set min-height: 100vh; for better responsiveness. For improved accessibility 📈 for your content, it is best practice to use em for media-queries. Using these unit gives users the ability to scale elements up and down, relative to a set value. If you have any questions or need further clarification, feel free to reach out to me.
Happy Coding!
Issues using the right font #appreciate comments
HI @Frankmona I can see you don't import the right way. please check below for correction
@import url('https://fonts.googleapis.com/css2?family=Big+Shoulders+Display:wght@700&family=Lexend+Deca&display=swap');
also change this: font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
to this: font-family: 'Big Shoulders Display', cursive;
i hope this help?
Hi there, I'm Yves and this is my solution for this challenge.
This challenge looks simple. yet still challenging! Especially when making it accessible.
A things that I learned in CSS
Build with
Anyway, feel free to give me any suggestions or feedback. Thanks!
@hozayves Nice work mate. i will suggest you use rem for font sizes and em for padding and the likes.
@musayar9 happy coding mate, nice job but i would say you should fix the responsiveness. to make you design more charming.
@nasirmca nice try I guess this is your first challenge, you still need to fix the responsiveness both web and mobile view. The layout are not appealing.
