Conversation
gracexinran
left a comment
There was a problem hiding this comment.
Nice job! You used a lot of classes which are helpful to add the css attributes to specific section of code. I would also recommend to adjust maybe the flex-boxes setting (or other options) to make it more similar to the mobile view when shrink the screen size. Currently most of the images are not wrapped to the next line.
| #why-box img { | ||
| float: left; | ||
| margin-right: 10px; | ||
| } |
There was a problem hiding this comment.
The space between each list (text and image) will be changed and they are not wrapped to the next line. It can be helpful if adding a flex-flow: row wrap.
| } | ||
| .flex-item { | ||
| width: 33%; | ||
| } |
There was a problem hiding this comment.
May be give a value like 200px to the width then the images could be wrapped to the next line.
|
|
||
| .team-item-container * { | ||
| margin-bottom: 10px; | ||
| } |
|
|
||
| .support-about div { | ||
| width: 33%; | ||
| } |
There was a problem hiding this comment.
I also recommend to use the value of width.
|
|
||
| nav ul li:first-child { | ||
| flex-basis: 50%; | ||
| } |
There was a problem hiding this comment.
Nice use of flex-basis and much cleaner than me!!
| grid-template-columns: auto auto auto; | ||
| justify-content: space-around; | ||
| grid-gap: 50px; | ||
| } |
There was a problem hiding this comment.
I saw that at here the images for sponsors changes(shrank) when changing the size of screen.
Startrly
Congratulations! You're submitting your assignment.
Comprehension Questions