Tribute Page - Elon Musk

Code Feedback
1

Hi everyone. This is my first post on the forum and it’s also the first time I publish a project. I hope you can help me fix this:
https://codepen.io/ouramdalo/pen/wvzeQaY

I tried this on my mobile with chrome but it seems to not load some css (such as “Companies Timeline” color text and also media queries)

3 Likes
2

Hey @oruamdalo!
Welcome to the Forum!

  • In line 112 in CSS section, there are two semicolons.

  • The Tesla’s image is not there

  • The content for the “SpaceX” is too big.

Please make these changes

Good work!

1 Like
3

I did everything you told me. Could you test the website on a mobile device? Using firefox in “mobile mode” from PC it seems okay, but when I try it on actual android device it shows the page like I am using a desktop browser (even if I deactivate that mode)

1 Like
4

The detail look like this

Screen Shot 2020-12-19 at 19.49.00
Screen Shot 2020-12-19 at 19.49.001242×2208 194 KB

It is narrow

5

Thanks for helping me! I will fix this soon.

1 Like
6

Welcome to the forums @oruamdalo. Your page looks good. Some thing to revisit;

  • 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.
    • The link to the font goes in the box labeled ‘Stuff for <head>’
  • Run your CSS code through this W3C validator.
    • There are a couple of areas to address
  • Do not use the <br> element to force line breaks or spacing. That’s what CSS is for.
  • Accessibility is about being accessible to all users. Review the lesson about giving meaningful text to links.
7

Thank you very much, I appreciate your help. I will implement these changes as well

8

I think now it should be okay. I probably still have to work on accessibility, because of some a tag links. I also tested it on mobile, it doesn’t seem bad.
Hope I improved it. Let me know :slightly_smiling_face:

1 Like