Conversation
north108
left a comment
There was a problem hiding this comment.
Really great job!! Your code is bone DRY. So impressed, teach me your ways.
| font-family: 'Saira Stencil One', cursive; | ||
| } | ||
|
|
||
| .center{ |
There was a problem hiding this comment.
I love how you created a class for each sections header, this is a great way to DRY your code.
| } | ||
|
|
||
|
|
||
| hr { |
There was a problem hiding this comment.
What is hr? Is this a way to section things like
There was a problem hiding this comment.
That didn't print how I expected... I meant: Is this a way to section things like div?
| grid-template-columns: 1fr 1fr 1fr | ||
| } | ||
|
|
||
| .container li { |
There was a problem hiding this comment.
In order to get the three Why? reasons to line up and respond appropriately, look into using both grid and flex. Adding a display to .container ul would help, not just to .container li.
| display: grid; | ||
| grid-template-columns: 1fr 1fr 1fr | ||
| } | ||
|
|
There was a problem hiding this comment.
This will make the section flexible and then you can go into each li and use grid to get the correct design.
| container ul { | |
| display: flex; | |
| justify-content: center; | |
| } |
| margin: 0; | ||
| padding: 0; | ||
| } | ||
|
|
There was a problem hiding this comment.
Then adding a separate .container li and using grid. This is where you can design how the img relates to strong and relates to p.
| .container li { | |
| display: grid; | |
| grid-template-columns: (two columns at your choice of size); | |
| grid-template-rows: (two rows at your choice of size); | |
| } |
| padding: 0; | ||
| } | ||
|
|
||
| .container li img { |
There was a problem hiding this comment.
Then once your li are grids, then in img, strong, and p you can pick where each lives.
| .container li img { | |
| .container li img { | |
| display: grid; | |
| grid-row-start: 1; | |
| grid-row-end: 3; | |
| grid-column: 1; | |
| } |
| } | ||
|
|
||
| h2 { | ||
| font-size: xx-large; |
There was a problem hiding this comment.
I didn't know you could use terms like this for font-size! Definitely going to use this going forward:)
Startrly
Congratulations! You're submitting your assignment.
Comprehension Questions