Skip to content
Submitted about 2 years ago

Stats Preview Card

Muhammad Zohaib•270
@codefolk
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Stats preview card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Pardon my novice HTML Markup.

Community feedback

  • Mohamed Ayman•190
    @RealMohamedAymanPosted about 2 years ago

    • You can put your image inside a div ( to make a colored layer ) Set the image opacity to 50% and the div ( layer above the image ) opacity to 100% Change to layer color to the required color

    • Use alternate text for your img tag <img src="image-header-desktop.jpg" alt="...">

    • Use lang attribute in your html tag <html lang="en"> ... </html>

    • Put a title for your page in your title tag <title> Page Title </title>

    • font is not a registered keyword for linking google fonts Here is an example for linking google font

    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Raleway:wght@400;700&display=swap" rel="stylesheet">
    • the paragraph element <p> is not allowed to be a child of <span> element
    Marked as helpful
    0

Please log in to post a comment

Log in with GitHub

Join 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