Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
11
Comments
14
George Bleyer
@georgebleyer

All comments

  • CoreJS•70
    @CopperMX
    Submitted over 2 years ago

    Stats Preview(sass, grid y flexbox)

    #sass/scss#vanilla-extract
    2
    George Bleyer•280
    @georgebleyer
    Posted over 2 years ago

    Hello,

    Congratulations on completing this challenge. Here are some tips on how you can make the image purple:

    In the HTML

    <picture></picture>
    

    In the CSS

    picture{
         background: url("../images/image-header-mobile.jpg");
         background-color: hsl(277, 64%, 61%);
         background-blend-mode: multiply;
    }
    

    I hope it helped.

  • Raul Lennon Gonçalves Almeida•210
    @luarxx
    Submitted over 2 years ago

    stats-preview-card-component-main

    2
    George Bleyer•280
    @georgebleyer
    Posted over 2 years ago

    Hello,

    Congratulations on completing this challenge. Here are some tips on how you can make the image purple:

    In the HTML

    <picture></picture>
    

    In the CSS

    picture{
         background: url("../images/image-header-mobile.jpg");
         background-color: hsl(277, 64%, 61%);
         background-blend-mode: multiply;
    }
    

    I hope it helped.

    Marked as helpful
  • Ola•520
    @Great-kiola
    Submitted over 2 years ago

    Stats-preview-component

    #accessibility
    1
    George Bleyer•280
    @georgebleyer
    Posted over 2 years ago

    Hello,

    Congratulations on completing this challenge. Here are some tips on how you can make the image purple:

    In the HTML

    <picture></picture>
    

    In the CSS

    picture{
         background: url("../images/image-header-mobile.jpg");
         background-color: hsl(277, 64%, 61%);
         background-blend-mode: multiply;
    }
    

    The <p> you can include a opacity: 60%; to make it more like the project.

    I hope it helped.

    Marked as helpful
  • JViktorija•40
    @JViktorija
    Submitted over 2 years ago

    Responsive landing page using HTML and CSS

    1
    George Bleyer•280
    @georgebleyer
    Posted over 2 years ago

    Hello,

    Congratulations on completing this challenge. Here are some tips on how you can make the image purple:

    In the HTML

    <picture></picture>
    

    In the CSS

    picture{
         background: url("../images/image-header-mobile.jpg");
         background-color: hsl(277, 64%, 61%);
         background-blend-mode: multiply;
    }
    

    The <p> you can include a opacity: 60%; to make it more like the project.

    I hope it helped.

    Marked as helpful
  • Łukasz•130
    @Lukaszwebster
    Submitted over 2 years ago

    stats-preview-card-component

    2
    George Bleyer•280
    @georgebleyer
    Posted over 2 years ago

    Hello,

    Congratulations on completing this challenge. Here are some tips on how you can make the image purple:

    In the HTML

    <picture></picture>
    

    In the CSS

    picture{
         background: url("../images/image-header-mobile.jpg");
         background-color: hsl(277, 64%, 61%);
         background-blend-mode: multiply;
    }
    

    The <p> you can include a opacity: 60%; to make it more like the project.

    I hope it helped.

    Marked as helpful
  • Ragu-The-Developer•120
    @Ragu-The-Developer
    Submitted over 2 years ago

    Stat Card Using HTML & CSS With FlexBox

    1
    George Bleyer•280
    @georgebleyer
    Posted over 2 years ago

    Hello,

    Congratulations on completing this challenge. Here are some tips on how you can make the image purple:

    In the HTML

    <picture></picture>
    

    In the CSS

    picture{
         background: url("../images/image-header-mobile.jpg");
         background-color: hsl(277, 64%, 61%);
         background-blend-mode: multiply;
    }
    

    The <p> you can include a opacity: 60%; to make it more like the project.

    I hope it helped.

  • Bárbara Damasceno•320
    @barbaradamasdev
    Submitted over 2 years ago

    Order summary card

    1
    George Bleyer•280
    @georgebleyer
    Posted over 2 years ago

    Hello DEV,

    Your site is very good, I just noticed that you didn't put the background waves. In my case I used a Wave generator on the internet, follow the link, and I put this background .svg image in my body.

    Any doubt you can call me.

    Marked as helpful
  • MHAA•50
    @MHA2001
    Submitted over 2 years ago

    QR code

    2
    George Bleyer•280
    @georgebleyer
    Posted over 2 years ago

    Hello,

    Congratulations on completing this challenge. Here are some tips on how to align your card. your card its not inthe middle of the page. For that you need to put in your .body this part

    min-height: 100vh;
    

    and remove the:

    padding-top: 5%;
    

    I hope it helped.

  • Hassan-Habib•10
    @Hassan-Habib
    Submitted over 2 years ago

    QR code pc

    2
    George Bleyer•280
    @georgebleyer
    Posted over 2 years ago

    Hello,

    Congratulations on completing this challenge. Here are some tips on how to align your card. In your body put this code:

    display:grid;
    place-items:center;
    min-height: 100vh;
    

    You can use Flex Grid to align the card to.

    I hope it helped.

    Marked as helpful
  • Simeon Nkwachukwu C.I•10
    @somop0
    Submitted over 2 years ago

    landing page using border radius css specifity

    2
    George Bleyer•280
    @georgebleyer
    Posted over 2 years ago

    Hello,

    Congratulations on completing this challenge. Here are some tips on how to align your card. In your .body put this code:

    display:grid;
    place-items:center;
    min-height: 100vh;
    

    You can use Flex Grid to align the card to.

    In your code try to use <h1>, <h2> and <p> to have a better code other than use just the <span>

    I hope it helped.

    Marked as helpful
  • Raghda19•110
    @Raghda19
    Submitted over 2 years ago

    QR-code-component

    2
    George Bleyer•280
    @georgebleyer
    Posted over 2 years ago

    Hello,

    Congratulations on completing this challenge. Here are some tips on how to align your card. In your .body put this code:

    display:grid;
    place-items:center;
    min-height: 100vh;
    

    You can use Flex Grid to align the card to.

    I hope it helped.

  • uisufian•10
    @uisufian
    Submitted over 2 years ago

    Product preview card component

    1
    George Bleyer•280
    @georgebleyer
    Posted over 2 years ago

    Hello,

    Congratulations on completing this challenge. Here are some tip on how to center your card. In your .body put this code:

    display:grid;
    place-items:center;
    min-height: 100vh;
    

    You can use Flex Grid to align the card to.

    I hope it helped.

  • vertig0o•100
    @vertig0o
    Submitted over 2 years ago

    CSS

    2
    George Bleyer•280
    @georgebleyer
    Posted over 2 years ago

    Hello,

    Congratulations on completing this challenge. Here are some tips on how to align your card. In your .body put this code:

    display:grid;
    place-items:center;
    min-height: 100vh;
    

    You can use Flex Grid to align the card to.

    I hope it helped.

    Marked as helpful
  • BytePack•270
    @bytepack
    Submitted over 2 years ago

    Results summary component

    1
    George Bleyer•280
    @georgebleyer
    Posted over 2 years ago

    Hello,

    Congratulations on completing this challenge. Your design is very nice and clean, for me it was better than the original version.

Frontend Mentor logo

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub