Nneoma Njoku• 1,210
@SatellitePeace
Posted
Hello @dogukan0055 congrats on completing this project
Your project looks great on the big screen but it is not responsive
- To make your work responsive you have to change the direction of your cards and ratings to column because it is not possible for them to fit in a small screen as a row`
#comments{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
@media (min-width:800px) {
#comments{
flex-direction: row;
}
}
Also, do the same for your header section
-
Also using a mobile-first approach which I used in the example above makes it easier for you to create a responsive site
-
Lastly, your CSS is very disorganized which makes it difficult to navigate
-
Your CSS code should have an order like this
-
Google fonts
-
reset CSS
-
root
-
body/ html
-
general styles (for example you may decide that all your p will have the same color so instead of repeating the colour you can do something like this p{ color: #fff; })
-
nav
-
header-
-
main
-
section
-
footer
-
media queries
I Hope This Helps
0
