Skip to content
OverviewSolutions
10
Comments
6

Agelita eMe

@agelitaemeSpain170 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

  • Agelita eMe•170
    @agelitaemePosted over 2 years ago

    Hi, @michaelbulaongmusic!

    • In response to your question, you can intensify the color of the image by using:
    background-image: url(./images/image-header-desktop.jpg), hsl(277, 64%, 61%);
background-size: cover;
background-blend-mode: multiply;
    • And I recommend you to center the card with flexbox:
    body {
display: flex;
justify-content: center;
align-item: center;
}

    Good job! Keep it up!

    Marked as helpful
    0
  • Agelita eMe•170
    @agelitaemePosted over 2 years ago

    Buenas, Matías!!

    Para centrar tu tarjeta puedes usar flexbox: body {display: flex; justify-content: center; align-item: center}

    Espero haberte servido de ayuda! Ánimo!

    Marked as helpful
    0
  • Agelita eMe•170
    @agelitaemePosted over 2 years ago

    Hi, @sohailebada!

    Good job! But, maybe you could:

    • Center your card by using flexbox (in your body)
    • Use max-width to make your card responsive without having to add a media querie
    • Write down `border-radius: 20px´ to round all the corners of your card with just one line of code

    I hope it helps. Keep it up!

    0
  • Agelita eMe•170
    @agelitaemePosted over 2 years ago

    Hi, @ankit55555!

    Congratulations. You have finished your first challenge. But, from now on I recommend you to take a look at other users' solutions. But doing so you are going to find out that:

    • Maybe, you could separate your html from your css code, by using different documents.
    • How useful it can be flexbox or grid.
    • There are a lot of Youtube tutorials that may help you. Two of my favorite channels are FreeCodeCamp and Kevin Powell.
    • In certain ocassions, if you make your solutions responsive enough, you are not going to need to use any media queries (max-width).

    Good start, keep it up!

    0
  • Agelita eMe•170
    @agelitaemePosted over 2 years ago

    Hi, @polukarp

    Congratulations! You have done a really good job, although there are a few things that you may want to improve, as for example:

    • The "purple filter effect", as you have called it, which is easier than you may think. You'll have it just by writing down the following lines of code: background: url(./images/image-header-desktop.jpg), hsl(277, 64%, 61%); background-size: cover; background-blend-mode: multiply
    • Remember that the desktop design was made to a 1440 pixels width. So you may want to change the dimensions of your card.
    • If you want to take a look to another solution, here you have mine

    Keep it up!

    Marked as helpful
    0
  • Agelita eMe•170
    @agelitaemePosted over 2 years ago

    Hi!

    Here you have some tutorials that may help you:

    Have a nice day!

    0