Hello guys👋, this is my second project please watch it and give your feedback how is it. Thank You😊
Piyush jain
@PiyushJain01
All comments
- Piyush jain• 220
@PiyushJain01
Posted
Hi 👋 You can give
background :#ffe6ff;
to body instead of.wrapper
because in mobile view some area at bottom side is not covered by the color also the wrapper is not aligned vertically center (in small screens). You can add the below code to fix these problems.body { height: 100vh; display: flex; background: #ffe6ff; flex-direction: column; justify-content: center; }
I hope this will help you. Rest all is perfect. Happy Coding :)
Marked as helpful
0 - Jesús Yadiel• 50
@yeezusch23
Submitted
Hello everyone, some tips to improve my code?
I'm not sure why I can't show the icons directly from font awesome, I solved it with img but you can't change their color
Any feedbacks are appreciated
Piyush jain• 220@PiyushJain01
Posted
Hi 👋, Just add the below mentioned link to get the icons visible.
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.2/css/all.min.css" />
Happy coding :)
1 - Luis Olivero• 170
@Luis-Olivero
Submitted
Any advice where I should add media queries?
Piyush jain• 220@PiyushJain01
Posted
Hi , First of all congratulations on completing this challenge. In mobile view the container is not aligned horizontally center. Just try this :-
In mobile view :
.container { margin: 0 auto; padding-top: 2.5em; padding-inline: 1rem; display: flex; align-items: center; flex-direction: column; }
And in Desktop view :
@media (min-width: 580px) { .container { max-width: 800px; flex-direction: row; align-items:initial; }
Apart from this everything is perfect. 👍 Hope this will help you. Happy coding :)
Marked as helpful
0 - Ruthwik• 190
@web-devie
Submitted
First of all, thanks for passing by :)
-
I have built this project using flex and I am sure it can be built using "grid" but I don't know how to layout using grid. Question: I have a question what affect does laying in grid regarding this project. Is the affect minimal or huge?
-
I have struggled my bit using media queries as well when it comes div with class name "attribution" I can't position it according to screen size. Can anyone help me with that?
3.Any kind of feedback is highly appreciable. Have a glance at my code and suggest what I could have done better to achieve a better version than this. Thanks!
Piyush jain• 220@PiyushJain01
Posted
Hi 👋 In this media query
@media screen and (min-width: 365px) and (max-width: 750px)
the mobile design is showing only between 365px and 750px but if the screen size is less than 365px then again the desktop design is showing. So instead of this you can write@media screen and (max-width: 750px)
.For Attribution you can use
text-align
property instead ofposition :absolute;
to align the text in center..attribution{ font-size: 14px; font-family: Montserrat; text-align: center; }
I hope this will help you. Happy Coding :)
Marked as helpful
1 -
- Diego• 30
@DiegoValois
Submitted
How could I accumulate less code?
Piyush jain• 220@PiyushJain01
Posted
Your site is not visible please verify the live site URL that you have pasted. It has some issues. Here is the process of getting live link- Go to your repository settings ,scroll down and click on pages option. In pages there you will see the Source option in that branch is none by default you have to select main and save that. After 10-20 sec your live link will be ready. if you need any help then let me know.
Marked as helpful
1 - Dami• 35
@Damilare82
Submitted
Hey Guys, i must say i am very glad to be part of the community. i want to be a type of developer who uses css3 grid more than using flexbox and tend to make designs responsive that way..... and i have made lots of practice with it, i also want to be a type of developer that people can say wow he is so good with css Grid, although i know flex makes things easier but to me i believe Grid is more beautiful...
Any advice for me please?
Piyush jain• 220@PiyushJain01
Posted
This comment was deleted
0 - Mohammad Ejaz• 20
@mdejaz4450
Submitted
Please review my work.
Piyush jain• 220@PiyushJain01
Posted
Your site is not visible please verify the live site URL that you have pasted. It has some issues. Here is the process of getting live link- Go to your repository settings ,scroll down and click on pages option. In pages there you will see the Source option in that branch is none by default you have to select main and save that. After 10-20 sec. your live link will be ready. if you need any help then let me know.
Marked as helpful
0 - sanket kumar• 300
@sanketcharanpahadi
Submitted
I think I should improve media queries and the box shadow property in the (proceed to payment button) . Please give your feedback.
Piyush jain• 220@PiyushJain01
Posted
Nice work in mobile view. Small suggestion:- In .order-summary button you can add little transition, not mandatory but if you add then it looks perfect :)
Marked as helpful
0