Tribute Page-FIRST PROJECT EVERRR

Code Feedback
1

Hey Everyone!
Complete newbie here and just finished my first project, am quite pleased with it, despite its simplicity!
Please find my project here. I would really appreciate any feedback, good or bad! Please bear in mind this is my absolute first project of all time, so anything you see about anything, please feel free to comment on!

One slight issue I am having trouble understanding, is I am unable to get my image caption to be immedaitely underneath the image. There is always a blank line, which I cannot get rid of. I understand its something to do with the image being an inline element, and the “display: block” shoudl have solved it. However, I tried it a few diferent ways with no luck! If anyone can help, that would be great!

Thanks a lot every one! All the best!

2

As a Beginner i can tell you did great trust me you did good.
for the image caption, in the “#img-caption p” set “margin-top : 0px;” it will be a quick fix. i am also learning so, Keep up

3

Hi Natnael,

Thanks for your kind and encouraging words!

Thanks for the “margin-top” tip, that has solved the issue!

Regards!

1 Like
4

Welcome to the forums @carlosdevelopmentpat. Your page looks good. Some things to revisit;

  • Keep the test script when forking the pen (<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>).
    • The test script should be included, with all tests passing, when you submit your projects.
  • Codepen provides the boilerplate for you. It only expects the code you’d put within the body element in HTML. (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.
  • Review the lesson about giving meaningful text to links.
  • Make your page responsive. On smaller screens there’s a horizontal scrollbar
1 Like
5

Hi Roma,

Thanks for your time, I really appreciate your feedback.
Full disclosure, I did that site before I had finished the whole Responsive Web Design Curriculum.
Having finished, I have had another go, taking your feedback into account. Would you mind having a look? Any feedback is really welcome!

I am aware the script issue you mention, as well as the fact that codepen is intended only for the body section of a site. At this point just trying to get used to writing the ‘standard’ way. When I want to check the test, I only copy and past the body tag underneath the script!

Please find the site here!

All the best!

6

Hi @carlosdevelopmentpat. I looked at the new page and do not see any difference. Everything I noted in the first review still exists with this page.

1 Like
7

Hi Roma,

Sorry, probably should’ve been more specific. It is the same page. Although I have simplified the code a lot.
I used more accesible tags.
I made the page responsive. At least when I shrink my browser, the site shrinks with it. Does that not solve the smaller screen issue you mentioned?

In any case, many thanks for having had another look! Hope you d not feel time has been wasted!
Regards,

8

I don’t think time has been wasted. I wanted to let you know that it seemed I was looking at the same page and nothing had been addressed.

  • The test script, which should be included with all tests passing, is not there.
  • The same link that I mentioned as not accessible has not been corrected. Read the attached article in that post. “wikipedia” is not accessible.
  • The page is not responsive. There’s a horizontal scrollbar because the table does not scale.
1 Like
9

Hi Roma!

Thanks for all your help! Managed to get the table adapted to smaller devices. Basically made it smaller when on certain screen sizes.

Here is the project if you want to take a look.

In terms of general praxis, is this a good solution?

Thanks!

10

@carlosdevelopmentpat, it’s responsive though the other two issues still exist.

1 Like