Skip to content
OverviewSolutions
21
Comments
7
DF
@FengDenny

All comments

  • DF•330
    @FengDennyPosted 6 months ago

    Nicely done

    0
  • RohanIV•160
    @RohanIVSubmitted 6 months ago
    What are you most proud of, and what would you do differently next time?

    Implementing grid layout for desktop view. Haven't used much of grid.

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

    Positioning the cards on desktop view.

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

    Any tips on grid or responsive measurements (in your opinion what do you used the most any why? i.e. fonts, height, padding and width

    Interactive Four Card Feature

    1
    DF•330
    @FengDennyPosted 6 months ago

    Hey, nicely done, but to give you some tips on responsive measurements or when should we should Flexbox over Grid or vice-versa:

    Use Flexbox When:

    1. You're working with a one-dimensional layout, either in a row or a column.

    2. You want to align items within a container along a single axis (either horizontally or vertically).

    3. You need to reorder items within the container.

    4. You're creating a navigation bar, a sidebar, or a flexible card layout (like this project).

    5. You want to evenly distribute space between items or align items with different sizes.

    6. You're working with dynamic content where the number of items may change.

    Use CSS Grid When:

    1. You're working with a two-dimensional layout, needing to align items both horizontally and vertically.

    2. You need to create complex grid-based layouts with multiple rows and columns.

    3. You want to create a responsive layout that adjusts its structure based on screen size.

    4. You're designing a grid-based gallery, a magazine layout, or a webpage with multiple sections.

    5. You need to align items in both dimensions, and their sizes are consistent.

    6. You want to control the alignment of the whole grid (e.g., centering it within the viewport).

    In Summary:

    Flexbox is best suited for one-dimensional layouts, such as navigation bars, flexible containers, and aligning items along a single axis.

    CSS Grid is ideal for two-dimensional layouts, like complex grid-based designs, multi-column layouts, and aligning items both horizontally and vertically.

    In many cases, you'll find that using a combination of Flexbox and CSS Grid provides the most flexible and efficient way to create modern layouts.

    You can use Flexbox for smaller, one-dimensional layouts within larger, two-dimensional Grid layouts.

    Happy frontending =)

    0
  • DF•330
    @FengDennyPosted 6 months ago

    The background should be cream: hsl(30, 38%, 92%), and P E R F U M E should be colored as dark-grayish-blue: hsl(228, 12%, 48%) with a smaller font-weight. Otherwise, it's good!

    1
  • DF•330
    @FengDennyPosted 6 months ago

    The background color should be Eggshell: hsl(30, 54%, 90%) and not Light Grey: hsl(30, 18%, 87%)

    Nevertheless, nicely done!

    0
  • DF•330
    @FengDennyPosted 6 months ago

    One thing I suggest for you to change is to give maybe 5px of margin-top to your card contents as this will help your content not feel cramped together.

    Otherwise, it's good to go!

    0
  • Martín Beltrán•260
    @JMBeltranDevSubmitted 6 months ago
    What are you most proud of, and what would you do differently next time?

    I feel proud to have completed this challenge, I hope to continue improving my code.

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

    I had no problems solving this challenge

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

    Any help is welcome

    Solution of the Blog Preview Card challenge

    1
    DF•330
    @FengDennyPosted 6 months ago

    Great solution!

    0
  • DF•330
    @FengDennyPosted 6 months ago

    Very nice design!

    0