My Tribute Page to Elon Musk. Awaiting feedback from fellow campers!

Hello Fellow Campers,

Just completed my #free-code-camp:project-tribute-page for Elon Musk. He is such an #inspiration to me and millions out there. Let me know how its is and feel free to comment and provide any feedback.

Here’s the link:

Appreciate your time…

Regards
Aniesh
@AgentAniesh

1 Like

Really neat page, However it seems like you times magazine image doesn’t seem to be responsive to small screens it’s jumping outside of your light colored border. I think that adding the img-responsive tag would fix that though! Awesome work!

You did a good job. I like the background idea, I did something similar for my page on Nikola Tesla. Maybe add some padding around the text so it’s not flush with the border?

BTW I like your choice of person.

Hey goofydad21,

Thank you so much for your feedback. I am glad you brought it to my notice. I have made the changes. Would you mind checking again and telling me how it is now…

Hey lhrkamp,

Thank you:slight_smile: for taking time to review my code and page . I have made the necessary changes. Would you mind checking again and tell me how it looks now.

Appreciate your time and patience.

Regards
Aniesh
Twitter: @AgentAniesh

Aniesh, the page looks awesome now! Honestly I wish I had thought of that background image idea for my page. Really good job! :slight_smile:

Thank you so much Goofydad21. Can you send me a link to your page here. Have you / Do you use Sublime text editor? Are you on Twitter?

Nice fix. There is still some text that is flush with the border. Since all of your text is within the .row div, why not add padding to this class? Also, you defined the same font for all your elements. It would be more efficient to define the font once in the body. Or you could define it like this:

h1, h2, h3, h4, p { font-family: Times New Roman; }

For some reason you had 3px as your left padding and 8px as your right. I changed both to 15px.

Here is the edited CSS:

body { background-image:url("http://wpmedia.news.nationalpost.com/2015/08/tesla.jpg?quality=65&strip=all&w=620&h=445"); background-color:#20B2AA; margin-top: 450px; margin-left:50px; margin-right:50px; margin-bottom:320px; font-family: Times New Roman; }

h1 { font-style: oblique; }

p { font-size: 18px; font-color: #ADFF2F; }

li { font-size: 20px; font-weight: normal; font-color: #ADFF2F; }

.row { padding: 5px 15px 5px 15px; }

#quote { font-size: 1em; }

Hope this helps

Here is a link to my page aniesh feel free to take a look. http://codepen.io/goofydad21/pen/VmwaWV

This looks great! Good job :+1:

1 Like

Hello lhrkamp,

Many thanks for your valuable inputs. I have changed the padding to 15px as suggested and Yup, the page alignment along the edges look much better now. Thank you, I didn’t want to change all font to Times New Roman so I left it that way. Overall, looks really neat and clean now. Thanks a lot again… :smile:

Hello Brandon,

That’s a nice page. At the end of the page you wanted to give a link to another site that would open in a new tab altogether. Unfortunately, instead of ‘href’ you quoted ‘src’. May be you could edit it to-

a href=“http://starwars.wikia.com/wiki/Luke_Skywalker/Legends"target=”_blank">here.

Also by the end of the page-

p class=“text-center”> Written and coded by a src="#">Brandon Salyer

In the above line of code- Do you have another website/blog of your own that you want users to go to when they click on your name. If not, you may choose to take off the link reference to your name coz ppl may be think its a link and when they click on it, it won’t take them any where…

Apart from the above mentioned points, I liked the image, back ground color and the points highlighted- never knew about the Galactic timelines… :stuck_out_tongue:

Thanks for taking time to review my code @haiphi:blush :blush:

Oh good catch about the href sec mix up thank you! And I put my name as a link so when I finish my portfolio it will take people there but right now it’s just a dead one! Awesome feedback though thanks!