I did the courses a while back…life happened and then I tried doing the project finally last week a realized I forgot everything! SOOO this week I re learned it and tackled the project.
It’s not the prettiest crayon in the tool box, but its my crayon! haha.
I tried to make it look nicer with some box shadows around the title, but I couldn’t get the feel right.
I went Tenacious D cause that’s all I could think about when I read the Tribute.
I’ve checked out your Tribute Page and think that it looks really neat, simple, but effective.
If you want, for further eye-candy, you could use little png images instead of bulletpoints for the li(list items), taken from the movie, like guitars, little-devils and so on. But it’s just an idea.
I’m in the same boat. Just getting back now. Great job on the tribute page. Finessing the space around the image and the title might be good but well done
Welcome to the forums @Carliess. Your page looks good. Some things to revisit;
Codepen provides the boilerplate for you. It only expects the code you’d put within the body element in the HTML editor. (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.
For instance, links to fonts go in the box labeled ‘Stuff for <head>’
Mentioning because there are elements missing. Review this for an understanding of the HTML boilerplate tags.
You may have noticed that even though the dates in the timeline have been coded to be bold they do not display as such. This is because the font you chose only has one style (weight). Browsers will try to accommodate but will not be able to.
If you decide on another font, look for one that has more than one style. You’ll want 400 (regular weight) and 700 (bold weight).
Question, would <header> and <head> not be the same thing?
If I’m understanding what you’re saying and what i’m reading, it says <head> is for meta data, so like when I imported the fonts etc… and <header> is more like the top of page, above a navigation bar. If that’s the case, super enlightening bud!
No, they are not the same. They are two very different HTML tags with two very different purposes.
And yes, what you’ve said in your second paragraph regarding how they are used is correct.
So since codepen provides the boilerplate for you, you do not need to declare the doctype or have the html, head or body elements.
You can see how codepen does it for you.
Click the “export” button then “export.zip” and “download.zip”. When you expand the zip file open the “dist” folder and examine the index.html file. Notice there are two doctype declarations, etc. This is because codepen adds them for you but since you had them in the HTML editor they’re added again. It’s not very pretty.
It’s not a big deal/showstopper at this point but is something you should be aware of. Pointing it out because you seemed interested.
If at some point in time you want to take your code from codepen and put it onto GitHub, export would be the easiest way since all boilerplate tags are added…including the link to the stylesheet.
I’ve edited your posts. Notice the code is missing? When entering a line of code surround it with a single backtick so it shows. Or use the preformatted text tool in the editor. The following explains how to enter code blocks.
I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.
You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.