Skip to content

Conversation

@nidhiparixitpatel
Copy link

@nidhiparixitpatel nidhiparixitpatel commented Apr 5, 2019

Startrly

Congratulations! You're submitting your assignment.

Comprehension Questions

Feature Feedback
How are CSS Grid & Flexbox similar The are similar because they both help you arrange things on your site.
Give one example where you choose Flexbox over Grid Flexbox is a better at resizing and layout when the size of the screen is changing.
Where did you choose to use CSS Grid and why did you make that decision I chose to use CSS grid for the title area with the "some call to action" button. I made this decision bc I felt that it was easier to achieve the spacing I wanted with CSS Grid. Although, I believe I can get something similar with flexbox as well.
What was the hardest part of this assignment, and why was it difficult This was a difficult assignment for me because I have not used HTML or CSS before and it took me a while to get the project off the ground and understand what terms like padding, margin, section, elements, divs all mean.
What concept did you get the most clarity on through Startrly? I learned about how to target specific items with HTML and CSS and how there are multiple ways to get the same look, but there are pros and cons to different choices. I also learned to use CSS Grid and Flexbox better through practice!

Copy link

@piffer59 piffer59 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think your code looked really dry. Nice job! I found looking at your code really helpful.

font-weight: bold;
text-align: left;
}

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Organizing the navbar into a grid was a clean way to do this. Is it possible to do this with fewer columns and make them of different widths?

text-align: left;
}

.title{
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

By setting this up as a grid you avoided having to do weird things with the , that's great!


.quote {
border-bottom: 2px solid grey;
border-top: 2px solid grey;
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice job combining these border styles

}

blockquote, blockquote + p {
font-style: italic;
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You might be able to add this to the .quote declaration above.

@@ -0,0 +1,142 @@
* {
font-family: 'Nanum Gothic', sans-serif;
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You could try importing a Google font at the top of this file

margin: auto;
display: grid;
grid-template-columns: 1fr 1fr 1fr
}
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You can try adding a grid inside of a grid that may help you align your text here.

}

ul {
padding-inline-start: 0px;
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice!

grid-template-columns: 1fr 1fr 1fr
}

.sponsors {
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I like how you did this section

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants