Skip to content
OverviewSolutions
22
Comments
2
Henrique Dummer
@HenriqueDummer

All comments

  • Facundo•40
    @1991facundoSubmitted about 2 years ago

    Hello team! hope you are doing fine.

    This is my 2nd challange i did for frontendmentor.io

    I have a couple questions.

    A) I couldnt make the border radius on the pictures as the example you sent me.

    B) i couldnt get the text in the same way you sent me

    C) im having issues to leave the card in the middle of the page. Same with the last challenge (the qr code one), i had to watch a youtube video and in one the guy was using the

    min-height: calc(100vh - 1px);

    and in the other one

    max-height: calc(100vh - 1px);

    Im really confused on how it works, do you have any tip to understand it?

    Thanks!!!

    Perfume responsive

    3
    Henrique Dummer•350
    @HenriqueDummerPosted about 2 years ago

    Hello facundo, how are you?

    I think i have a solution for your problem A.

    You can simply apply "overflor: hidden " in your container, this hides anything that cross the limits of the element you're applyng it to

    Marked as helpful
    0
  • Henrique Dummer•350
    @HenriqueDummerPosted over 2 years ago

    Hello Cristian, nice work :)

    I noticed that each of you card has a "border-radius" property, but if you take a look in the design it should be an overall "border-radius".

    So instead of apply the "border-radius" in all of your cards you could do something like this in your CSS:

    .card-1 { border-top-left-radius : 8px;
    border-bottom-left-radius : 8px; }

    .card-3 { border-top-right-radius : 8px;
    border-bottom-right-radius : 8px; }

    Then your "border-radius" will be aplied only in the edges

    Hope it helps you :D

    0