nwclass-alex - #193
Conversation
|
Karma website changes |
| <!-- Remember: Use semantic HTML tags like <header>, <main>, <nav>, <footer>, <section> etc --> | ||
| <!-- All the images you need are in the 'img' folder --> | ||
|
|
||
| <nav class="navbar"> |
There was a problem hiding this comment.
nav should be in a <header>
| <img src="C:/Users/aciun/Documents/GitHub/HTML-CSS-Coursework-Week2/img/instagram-icon.svg"/> | ||
| </div> | ||
| </section> | ||
| <footer>© Karma Mobility, Inc.</footer> |
There was a problem hiding this comment.
<footer> should be outside <main>
| <footer>© Karma Mobility, Inc.</footer> | ||
| </main> | ||
| </body> | ||
| </html> |
There was a problem hiding this comment.
Overall, good use of semantic HTML tags
| <p>Join us on</p> | ||
| <img src="C:/Users/aciun/Documents/GitHub/HTML-CSS-Coursework-Week2/img/twitter-icon.svg"/> | ||
| <img src="C:/Users/aciun/Documents/GitHub/HTML-CSS-Coursework-Week2/img/facebook-icon.svg"/> | ||
| <img src="C:/Users/aciun/Documents/GitHub/HTML-CSS-Coursework-Week2/img/instagram-icon.svg"/> |
There was a problem hiding this comment.
All images should have alt attributes even if it the value is empty.
| width: 18px; | ||
| } | ||
|
|
||
| .bars::before, .bars::after { |
| <li class="item"><a href="#blog">Blog</a></li> | ||
| <li class="item"><a href="#help">Help</a></li> | ||
| <li class="item"><a href="#login">Login</a></li> | ||
| <li class="toggle"><a href="#"><span class="bars"></span></a></li> |
There was a problem hiding this comment.
The hamburger icon should be within a button, since toggling the menu is an action.
| margin-left: auto; | ||
| margin-right: auto; | ||
| width: 40%; | ||
| } |
There was a problem hiding this comment.
try to use ems/rems wherever it is appropriate, this will improve responsiveness. For example use rems to set font-sizes and ems to set padding, margin & border-radius based on the font size of the current element.
|
|
||
| .features-1 { | ||
| display: grid; | ||
| grid-template-columns: auto auto auto; |
There was a problem hiding this comment.
for repetetive values, consider using repeat(), for example: grid-template-columns: repeat(3, auto);
|
Your coursework submission has been closed because nobody has interacted with it in six weeks. You are welcome to re-open it to get more feedback. |
3 participants
Volunteers: Are you marking this coursework? You can find a guide on how to mark this coursework in
HOW_TO_MARK.mdin the root of this repositoryYour Details
Homework Details
Notes
What did you find easy?
What did you find hard?
What do you still not understand?
Any other notes?