Tell us what’s happening:
I’m confused as to what needs to be done for this project. I’m stuck on the first topic going down to the last one, to complete the solution. I just got here today, after watching the videos on how to complete the other challenges when I got stuck, but noticed this one doesn’t have a video to help make a tribute page. How do I create a tribute page?
Your code so far
- Objective: Build a CodePen.io app that is functionally similar to this: https://codepen.io/freeCodeCamp/full/zNqgVx.
- Fulfill the below user stories and get all of the tests to pass. Give it your own personal style.
- User Story #1: My tribute page should have an element with a corresponding
id="main", which contains all other elements.
- User Story #2: I should see an element with a corresponding
id="title", which contains a string (i.e. text) that describes the subject of the tribute page (e.g. “Dr. Norman Borlaug”).
- User Story #3: I should see a
divelement with a corresponding
- User Story #4: Within the
img-divelement, I should see an
imgelement with a corresponding
- User Story #5: Within the
img-divelement, I should see an element with a corresponding
id="img-caption"that contains textual content describing the image shown in
- User Story #6: I should see an element with a corresponding
id="tribute-info", which contains textual content describing the subject of the tribute page.
- User Story #7: I should see an
aelement with a corresponding
id="tribute-link", which links to an outside site that contains additional information about the subject of the tribute page. HINT: You must give your element an attribute of
targetand set it to
_blankin order for your link to open in a new tab (i.e.
- User Story #8: The
imgelement should responsively resize, relative to the width of its parent element, without exceeding its original size.
- User Story #9: The
imgelement should be centered within its parent element.
- You can build your project by forking this CodePen pen. Or you can use this CDN link to run the tests in any environment you like:
- Once you’re done, submit the URL to your working project with all its tests passing.
- Remember to use the Read-Search-Ask method if you get stuck.
Your browser information:
User Agent is:
Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Safari/537.36 Avast/71.0.1037.99.
Link to the challenge: