Tribute Page and Form Survey

Hey everyone!
Here are the first two Web Design Challenges I’ve completed.

Survey Form:
https://codepen.io/lexynr1215/pen/WNoRyER

Tribute Page:
https://codepen.io/lexynr1215/pen/rNWWOeB

Any and all feedback, pointers, and/or criticisms would be greatly appreciated!

I am looking at your tribute page from a mobile view. It looks like your text is squashed onto the middle of the page. It probably has to do with margin or padding otherwise great work. Keep going!

1 Like

Welcome to the forums @lexynr1215. Your pages look good. Some things to revisit;

tribute

  • 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.
  • Accessibility is about being accessible to all users. Review the lesson about giving meaningful text to links. For a more thorough explanation read Web Accessibility in Mind.
    • her wikipedia entry” is not accessible

survey

  • same re: codepen provides the boilerplate for you
1 Like

Whoops! Thank you for pointing that out. Just fixed it.

Okay, I just made some changes. Thank you for helping me.

Glad to help. Your pages look good.

Look forward to your next projects.

1 Like

Hi there,

Both your pages look good.

I noticed your tribute page has a horizontal scroll bar when you narrow the screen. This is caused by sizing an element too large. In your case, it looks like it’s the padding on the header and footer.

It’s often better to use relative units for sizing rather than absolute units (like px) because relative units scale better.

Here’s an article about CSS Units.

1 Like

Hello,

I changed most of the units from absolute units to relative units.
I tried to get the horizontal scroll bar down as much as I could. But in the end I cheated and just bummed up the media query.

1 Like

Nice. I almost never use absolute units.