Skip to content
OverviewSolutions
10
Comments
8
P

elCris99

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

  • P
    Valeria Montoya•400
    @ValeriaMontoyaSubmitted about 2 months ago
    What are you most proud of, and what would you do differently next time?

    I used the hover media query for the first time 🤓

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

    1-Line Layouts - 10 single-line CSS layouts by @una. The seventh layout helped me achieve responsiveness for the images:

    .main {
  // ...
  &__images {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    // ...
  }
  // ...
}
    What specific areas of your project would you like help with?

    I'd appreciate any feedback to help me improve 👀

    Responsive meet landing page

    #sass/scss
    1
    P
    elCris99•170
    @elCris99Posted 26 days ago

    Using the header section images as background was a simple and effective solution, maybe less flexible but it does its job. The page is fully responsive, good job.

    1
  • P
    nimrodEDE•270
    @nimrodEDESubmitted 6 months ago
    What are you most proud of, and what would you do differently next time?

    I'm proud of using grid effectively, it wasn't such an issue this time and im glad :)

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

    i had some trouble making the grid elements have the same width as the elements in the picture . i overcame them by tweaking the margin and padding of the grid container.

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

    i just need your opinion and honest review :) thanks

    testimonials-grid-section-main

    1
    P
    elCris99•170
    @elCris99Posted 6 months ago

    Hi, great work. The code seems well organized. As for the html, consider adding a value to the different "alt" in the <img>. As for the css, try to manage the layout with different media queries, in your case the cards are too narrow at some sizes. Finally, you could also add a max-width to the testimonial container, so they don't grow too much when the window size is too large. Hope you find some of this advices useful.

    Marked as helpful
    1
  • P
    elCris99•170
    @elCris99Posted 6 months ago

    Apart from details, like font-size and border-radius being different from the OG design, the result in desktop screen-size is good. What could improve your page is the use of some "div" as a container. Let me explain better, at certain screen sizes there is some overflow, on the other side, when the screen size becomes large, the lateral distance between your cards increases "to infinity" so to speak. To avoid overflow, you should make your cards more flexible or simply use a higher media query and change the layout. In the second case instead, to avoid that your cards move too far away one from another, you could use a "max-width" on the container.

    0
  • P
    elCris99•170
    @elCris99Posted 6 months ago

    Apart from some measurements that do not match, which is not a problem, the important thing is that you wrote semantic html and responsive css. everything here seems well done, the "original price" with the "visually-hidden" class is a good addition for accessibility

    0
  • P
    elCris99•170
    @elCris99Posted 6 months ago

    Hi, good job completing this challenge. Even though I am still very inexperienced, I'll try to leave you some advice that you might find useful:

    1. You should use either padding or margin to avoid that your "containers" touch the lateral edges of the window.
    2. Using "containers" with a maximum size also allows you to avoid that the text lines get too long, this will make your page easier to read. Even if it's not much, I hope you found out it helpful
    0
  • Hieu Tran•60
    @hieutran249Submitted 7 months ago
    What are you most proud of, and what would you do differently next time?

    i've learnt to use rem, em

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

    align divs, responsive

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

    responsive

    flex

    1
    P
    elCris99•170
    @elCris99Posted 7 months ago

    If u find difficult to align divs or to create layout u should practice flexbox and grid. At first u can use some media queries for responsiveness, then maybe u coud learn some more advanced grid concepts.

    0
View more comments