#Freecodecamp #FCC #TributePage #HowTo #Challenge #ResponsiveWebDesign #HTML #CSS #HTML CSS Tutorial #Tutorial #Codepen #Wikipedia
FYI: For best view look at this video in full width screen.
In this video we are going to cover "HOW TO BUILD A TRIBUTE PAGE" using codepen.io. This is a Responsive Web Design Project. Content for this video is from Wikipedia. If you have questions, suggestions leave comments below.
I am going to leave the Wikipedia link and the Codepen link below.
FreeCodeCamp Tribute Page User Stories with Timestamps:
00:00 How to Build a Tribute Page
02:35 User Story #1 How to add id="main" which contains all elements
02:52 User Story #2 How to add string with corresponding id="title"
05:55 User Story #3 How to add figure or div element with corresponding id="img-div"
07:15 User Story #4 How to add img element within img-div with corresponding id="image"
09:10 User Story #5 How to add textual content within img-div with corresponding id="img-caption"
10:26 User Story #6 How to add textual content describing the subject of the tribute page with corresponding id="tribute-info"
12:00 User Story #7 How to add anchor(a) element with corresponding id="tribute-link" and "target" is set to "_blank"
15:00 User Story #8 How to make the image responsively resize, relative to the width of its parent element.
17:00 User Story #9 How to center img element within its parent element
Codepen.io
https://codepen.io/Traverse-Create/fu...
Wikipedia
https://en.wikipedia.org/wiki/Alan_Tu...
Music by Bensound