DF
@FengDennyAll comments
- @salmasweidSubmitted 7 months ago
- @RohanIVSubmitted 7 months agoWhat 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
@FengDennyPosted 7 months agoHey, nicely done, but to give you some tips on responsive measurements or when should we should
Flexbox
overGrid
or vice-versa:Use Flexbox When:
-
You're working with a one-dimensional layout, either in a row or a column.
-
You want to align items within a container along a single axis (either horizontally or vertically).
-
You need to reorder items within the container.
-
You're creating a navigation bar, a sidebar, or a flexible card layout (like this project).
-
You want to evenly distribute space between items or align items with different sizes.
-
You're working with dynamic content where the number of items may change.
Use CSS Grid When:
-
You're working with a two-dimensional layout, needing to align items both horizontally and vertically.
-
You need to create complex grid-based layouts with multiple rows and columns.
-
You want to create a responsive layout that adjusts its structure based on screen size.
-
You're designing a grid-based gallery, a magazine layout, or a webpage with multiple sections.
-
You need to align items in both dimensions, and their sizes are consistent.
-
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 -
- @SkyWeb20Submitted 7 months ago@FengDennyPosted 7 months ago
The background should be
cream: hsl(30, 38%, 92%)
, andP E R F U M E
should be colored asdark-grayish-blue: hsl(228, 12%, 48%)
with asmaller font-weight
. Otherwise, it's good!1 - @adabati22Submitted 7 months ago@FengDennyPosted 7 months ago
The background color should be
Eggshell: hsl(30, 54%, 90%)
and notLight Grey: hsl(30, 18%, 87%)
Nevertheless, nicely done!
0 - @rahul11636Submitted 7 months ago@FengDennyPosted 7 months ago
One thing I suggest for you to change is to give maybe
5px
ofmargin-top
to your card contents as this will help your content not feel cramped together.Otherwise, it's good to go!
0 - @JMBeltranDevSubmitted 7 months agoWhat 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
- @Poornachandran14Submitted 7 months ago