NW6 | Zeliha Pala | HTML-CSS | Module-Project | Week 1 / 2 #650
Conversation
✅ Deploy Preview for cyf-module-project-html-css ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
| <!-- Navigation Bar --> | ||
| <nav> | ||
| <ul id="navigation__list"> | ||
| <li class="nav__item"> |
index.html
Outdated
| <section id="icons"> | ||
| <h1>Everyone needs a little Karma.</h1> | ||
| <div class="icon__images"> | ||
| <img src="img/icon-devices.svg" alt="device image" /> |
There was a problem hiding this comment.
These images are large, have a css class to take care of the width and height property and this should be fine
| </div> | ||
| </section> | ||
| </main> | ||
|
|
There was a problem hiding this comment.
You should have an <hr/> tag here with the right color to divide the content as shown in the sample image
index.html
Outdated
| <footer> | ||
| <h5>Join us on</h5> | ||
| <div class="media__icons"> | ||
| <a href="https://twitter.com/yourKarma" target="_blank "> <img src="img/twitter-icon.svg" alt="twitter icon"></a> |
There was a problem hiding this comment.
Each of these icons are inside a circle, can you try to get that with css?
There was a problem hiding this comment.
Hello,
Thank you for your help and time. I tried to fix the bugs. I hope I did. I did not understand the last comment.
Could you please explain what i did (because if i don't know how to do it i just try millons of time till I find the answer or till it works) and how it shoul be? ;)
There was a problem hiding this comment.
Hello. I
have just recognised the circle I am working withh two monitors and the one I display vscode has a very bright screen, so I couldn't see the
and circle." Thank you again.
Made style adjustments in the style.css file.
|
Hi, well done so far, the form page needs a little bit work, can you try to get it close to the design as much as you can? |
"Store" link navigates store page, "Meet Karma" link navigate homepage.
|
Hi @bunday. I have updated html and css codes for the Module-project level 2 would you mind checking my codes? Thank you. |
zelihapala
changed the title
| flex-wrap: nowrap; | ||
| justify-content: space-between; | ||
| align-items: center; | ||
| margin: 2px 90px; |
There was a problem hiding this comment.
Hi Zeliha, I am writing this comment for my "Module Project: Code Review" ticket. Great work overall, well done. I just wanted to say if you would use padding here instead of margin, you could implement your background color to your entire header. Background color changes the color of element until border, it doesn't effect margins color. But except this issue, great web site.
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?
No
What did you find hard?
Adjusting spacing: such as creating space between sections, headings, and buttons.
Modifying font weight: Styling navigation links: I wanted to style navigation links, including removing underlines, changing colors on hover, and adjusting font styles, and spend hours for it.
What do you still not understand?
I am not sure about flex and grid. I tried experimenting with CSS properties like flex-direction, placing items within grids, and using grid areas, but I didn't fully understand these concepts and used a trial-and-error approach.
Any other notes?