Skip to content
OverviewSolutions
10
Comments
19

Guy Ezra

@ezraguy615 points

I’m a mysterious individual who has yet to fill out my bio. One thing’s for certain: I love writing front-end code!

Latest solutions

View more solutions

Latest comments

  • Guy Ezra•615
    @ezraguy

    Hey @juniorjuarez, Great Work! 1 suggestion that I have is adding a little bit of transition to the hover state of the image by adding this CSS:

    .image div{
   transition: .3s ease;
}
    Marked as helpful
  • Guy Ezra•615
    @ezraguy

    hey @abhik-b, Great work! about the setTimeout on the animations, maybe animation-delay in your CSS is the solution you are looking for.

    Marked as helpful
  • Guy Ezra•615
    @ezraguy

    Hey, @Env-y your project looks very good! I have only a suggestion. in the 960px width break point maybe make the pricing cards half the width of the screen I think it will make them look better and more readable. other than that it looks great! Happ coding! 😄

  • Guy Ezra•615
    @ezraguy

    Hey @Etang131, I have 1 suggestion to offer, I think the image component should not be in the container. because the container has a max-width:1440px and when you look at the website with a desktop monitor there are white spaces on the sides because the screen is wider than 1440px. what I would do is would take the image out of the container CSS as a background image and add it as an img tag and give it the following CSS:

    .background-img{
position:'absolute';
width:100%;
height:100%;
z-index:-1;
}

    other than that it looks great! Happy coding! 😄

  • Guy Ezra•615
    @ezraguy

    Hey @abhik-b, great job!

    I have 2 suggestions:

    1. like @axevldk said around 300px width the text in the card starts to overflow.

    2. In the 1023px breakpoint I would make the card's width around 55% percent because, in my opinion, 80% percent looks a bit stretched and I would add min-width to the card.

    @media screen and (max-width: 1023px)
article {
    grid-template-areas:
        "image image"
        "details details";
    grid-template-columns: 1fr;
    grid-template-rows: 200px auto;
    height: 70%;
    width: 55%;
    min-width: 300px;

    other than that it's great!

  • Guy Ezra•615
    @ezraguy

    Hey @ApplePieGiraffe, your solution is absolutely beautiful, WOW. very professional! great job!

View more comments