Conversation
sun-alice
left a comment
sun-alice
left a comment
There was a problem hiding this comment.
Very nice job!! It looks very similar to the site we were supposed to recreate, excellent color scheme. I like your use of flex displays, it worked really well in your title/meet the team/sponsor sections. The sections could maybe be named something else other than section_1, 2, 3-- it was a little challenging identifying which css designs were for what section.
|
|
||
|
|
||
| <section> | ||
| <section class="section_4"> |
There was a problem hiding this comment.
section_2 and section_4 are both quotes, and are formatted similarly, so maybe they could be a class!
| <nav> | ||
| <div class="container"> | ||
|
|
||
| <nav class="nav"> |
There was a problem hiding this comment.
i think because the class="nav" is within class="container", you only need to have one class here.
e.g. if you had just div class="container", you can access the "nav" by:
.container nav {
#formatting stuff
}
| text-align: center; | ||
| } | ||
|
|
||
| .section_5 ul { |
| } | ||
|
|
||
| .section_5 img { | ||
| border-radius: 50%; |
| list-style: none; | ||
| display: flex; | ||
| justify-content: row; | ||
| flex-wrap: wrap; |
There was a problem hiding this comment.
very nice sponsor section, it expands when I expand my browser too
| } | ||
|
|
||
| .section_3 { | ||
| display: flex; |
There was a problem hiding this comment.
I had a hard time getting the last list element ("convenient") to stay on the right side of the image too. i ended up using a grid!
| .section_2 { | ||
| padding: 40px; | ||
| border-top: 3px solid lightgray; | ||
| border-bottom: 3px solid lightgray; |
There was a problem hiding this comment.
there is a border on many of your sections, so you could maybe add a general border to all sections to dry up the code a little
e.g.
section {
border-bottom: 2px solid lightgrey;
}
| } | ||
|
|
||
| .section_7 ul { | ||
| list-style: none; |
There was a problem hiding this comment.
you have list-style: none; in a few sections that have ul's, this could also maybe be moved into a general ul attribute to dry up code a little!
e.g.
ul {
list-style-type: none;
}
| } | ||
|
|
||
| .nav { | ||
| background-color: lightgray; |
| } | ||
|
|
||
| .nav ul li:hover { | ||
| background-color: lightsalmon; |
2 participants
Startrly
Congratulations! You're submitting your assignment.
Comprehension Questions