Portfolio section help

HTML-CSS
1

My page link:
https://codepen.io/adityush007/full/RwpLqzY
Can anyone help me pass the last test case? And also need help in fixing the gap between the project section and how there is little space between in both directions of the page.
Any help will be highly appreciated.

2

@adityush007, when a test fails click the red button to see which test(s) are failing and text to help you correct the issue.

  • Be sure and read more than just the first line of the failing message. The ability to read and comprehend error messages is a skill you’ll need to acquire as a developer. Ask questions on what you don’t understand.

You have a big issue with your page. Codepen provides the boilerplate for you. It only expects the code you’d put within the body element in the HTML editor. (No need to include the body tags). For anything you want to add to the <head> element click on the ‘Settings’ button, then HTML and add it into the ‘Stuff for <head>’ box.

  • For instance, links to fonts go in the box labeled ‘Stuff for <head>’
  • You have elements out of order which will cause you problems. Review this for an understanding of the HTML boilerplate tags.
1 Like
3

Thanks for the tips. But my navbar is fixed at the top with proper CSS as far as I understand, but it’s failing the test case. It’s been 5-6 days for me since I started this course, so if you could help me more I would be glad.

5

Now that you’ve corrected the HTML errors things are easier to see.

Where are you positioning your navbar? You’ve only styled for navbar elements. Your CSS code thus far

#navbar li {
  list-style: none;
  padding: 10px;
}
#navbar li:hover {
  background-color: red;
}
#navbar a {
  text-decoration: none;
  color: white;
  text-align: center;
  font-family: "Comfortaa", cursive;
}
#navbar ul {
  margin: 0;
  top: 0;
  width: 100%;
  padding: 0;
  overflow: hidden;
  background-color: #ebc90c;
  left: 0;
  display: flex;
  justify-content: flex-end;
  position: fixed;
  height: 50px;
  text-align: center;
  z-index: 10000;
  box-shadow: 2px 0 2px;
}
a {
  text-decoration: none;
}
6

I tried positioning it but I wasn’t able to get the desired results. So looked around tried to make it work with ul elements. If there is some other more feasible way please do mention it.

7

There’s no indication of this in your code. We will not give you the answer but will help to guide you but can only do that if you show what you’ve tried.

EDIT: you can get the failing test to pass by targeting your navbar and adding two property: value; pairs

1 Like
8

I just added position: fixed to navbar and it passed that test. Thanks for all the help. I’ll keep asking questions if I face a obstacle.

9

Good job on researching @adityush007.

1 Like
10

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.