Skip to content
OverviewSolutions
9
Comments
7
Anthony Becarne
@Abecarne

All comments

  • Oswaldo Castro•240
    @tufcoderSubmitted 7 months ago
    What are you most proud of, and what would you do differently next time?

    It's fun to use display: grid to put the cards in a good desktop layout.

    What challenges did you encounter, and how did you overcome them?

    Definitelly using display grid. It's my first time using that property. The other thing is to put the symbol "left quotation mark" inside the first card as a background and adjust the position.

    What specific areas of your project would you like help with?

    I'm not so sure about display grid tecniques, so if I like to get some help.

    Flexbox & Grid Mobile First Testimonials Grid Section

    1
    Anthony Becarne•160
    @AbecarnePosted 7 months ago

    Hello @tufcoder !

    You really did a great job on this even if it was your first time using the grid display.

    If I had to share any advice for learning this display, I would recommend this website : https://cssgridgarden.com/ It really helped me a lot to understand the fundamentals of it.

    Also, I fell like the images are a bit too big compared to the design. Finally, the breakpoint should be set for a more narrow screen size, like maybe 1200px ? I don't have a perfect answer for this haha it was just a feeling.

    Good luck for the next challenges !! :)

    0
  • Anthony Becarne•160
    @AbecarnePosted 7 months ago

    Hello @Anoop-Rajoriya!

    Great job for this challenge !

    I would suggest you to set a higher value for the width of the cards and also to scale down a bit the cards' title as it is bigger than the design. You also have switched the position of cards "Karma" and "Calculator" haha

    When you try the responsive of the page, I feel like the <p> with "Our Artificial [...]" in your header is too narrow when you have a mobile display.

    Good luck for the other challenges :)

    0
  • Anthony Becarne•160
    @AbecarnePosted 7 months ago

    Hello @vedjain773!

    Great work on this!

    I would recommend you to use your browser tool to check for the responsiveness of your website (if you are on chrome, you can press f12 or right-click -> inspect). This is a good way to modify the height / width of the window.

    Like this, you could use media queries to handle these different size.

    Godd luck for the other challenges :)

    0
  • Anthony Becarne•160
    @AbecarnePosted 7 months ago

    Hello @Va506851!

    You did a great job !!

    I would recommend you to change some things on the fonts (such as the size, the weigth and the color) to fit with the design. Also, in your code, i would suggest to use "prettier" extension to format your code and make it more readable and clear (you can find a tuto on how to do it in the first "learning path" of FrontEnd mentor). Like this you would avoid such mistakes as opening a <hr> tag just before closing your header line 55.

    And if you really want to be closer to the design, you can change the background-color of the body, add border radius to your main container and use flexbox in the body to center your component

    Good luck for the other challenges :)

    0
  • MrestebanNeva•60
    @MrestebanNevaSubmitted 7 months ago
    What are you most proud of, and what would you do differently next time?

    Logre llegar al diseño lo mas exacto posible y le aplique algo de dinamismo usando hover en algunas partes.

    What challenges did you encounter, and how did you overcome them?

    Aun me es dificil calcular las mediadas de los elementos y crear del todo una pagina 100% responsiva

    What specific areas of your project would you like help with?

    medidas y responsividad

    Tarjeta de perfil

    2
    Anthony Becarne•160
    @AbecarnePosted 7 months ago

    Hello @MrestebanNeva !

    You did a great job on this!

    If you pay attention to the hover behavior for the list of links, you can see that the cursor changed only when you go over the text, maybe you should change it to affect the whole <li> tag ?

    The animations are smooth and changing the opacity when not hover a link is a good idea !!

    Good luck for the next challenges :)

    Marked as helpful
    0
  • thezarababy•40
    @thezarababySubmitted 7 months ago
    What are you most proud of, and what would you do differently next time?

    i am proud of how i tackled margins and paddings.

    What challenges did you encounter, and how did you overcome them?

    margin and padding placement were quite challanging for me.

    What specific areas of your project would you like help with?

    how to shrink or enlarge the blog card within the body, either to have more space or take up more space depending on the need.

    flexbox, margins and paddings.

    1
    Anthony Becarne•160
    @AbecarnePosted 7 months ago

    Hello! Good job for this one!

    The author picture seems to be a bit too small (in the example, it is set as 32x32px).

    Also, for the container, try to set the box-shadow 8px 8px.

    Good luck for the other challenges! :)

    Marked as helpful
    0
  • BharathChallagulla•10
    @BharathChallagullaSubmitted 7 months ago
    What are you most proud of, and what would you do differently next time?

    Did everything on my own

    What challenges did you encounter, and how did you overcome them?

    Centering and fixing widths

    What specific areas of your project would you like help with?

    NA

    flex box

    2
    Anthony Becarne•160
    @AbecarnePosted 7 months ago

    Hello,

    For your texts, try to avoid using <br> tags and use margins / padding instead. For more info, you can check this link https://stackoverflow.com/questions/12788503/style-wise-br-or-padding-margin-elements :)

    Also, you could also reduce the border radius of the image to fit with the model. To center the text in the blank space under the image, you could use margin bottom to move up the text-part div

    Hope it will help !

    Marked as helpful
    0