Survey and Product landing building

HTML-CSS
#1

Hello everyone,

I m sorry to ask but I can’t just find the solutions, so I ask…

In the Survey form challenge, I don’t understand why #13 and #14 dont work in : https://codepen.io/PatrisD/pen/NWWNWxP

In the landing product challenge the #6: https://codepen.io/PatrisD/pen/jOOqqPX

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/77.0.3865.90 Safari/537.36.

Challenge: Build a Survey Form && build a product landing

Link to the challenge:
https://www.freecodecamp.org/learn/responsive-web-design/responsive-web-design-projects/build-a-survey-form && https://www.freecodecamp.org/learn/responsive-web-design/responsive-web-design-projects/build-a-product-landing-page

#2

For the form:

  1. You should only have one form element.

  2. You are missing the value attribute on the last radio button.

  3. You can’t have content inside void elements (your input elements).

Void elements

Void elements can’t have any contents (since there’s no end tag, no content can be put between the start tag and the end tag).

For the product page:

  1. You are not using the video correctly. Click the share button on the video and then click the Embed button. Copy the code and add the id to the iframe element.

<iframe id="video" width="560" height="315" src="https://www.youtube.com/embed/UtQpSGyPCBE" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

You have a lot of errors in your HTML. Press the down arrow to the right of the HTML code box and select “Analyze HTML”.

1 Like
#3

Hello,

Excuse me to bother you again but I did exactly what you asked in the product page(https://codepen.io/PatrisD/pen/jOOqqPX) but it doesn’t work…

#4

This is a good adviecefrom @ lasjorg
which seems to count for you here as well

In any case, you have errors both in the HTML and CSS. Instead of me pointing them out I want you to do this instead.

Go to your Codepen profile settings (not the setting for the pen, but for your profile). Now switch the Syntax Highlighting to Oceanic Dark and save the setting. Go back to the pen and make sure your new settings are working, the code will have different colors.

Look at the HTML and CSS, you should see code marked in red. That is the new Syntax Highlighting showing you where there are problems.

Press the down arrow to the right of the HTML code box and select “Analyze HTML”, do the same for the CSS.

#5

You need to remove the old video you have before it. Otherwise, the test will look at that element and not the iframe.

Remove this:

<a id="video" href="https://www.youtube.com/watch?v=UtQpSGyPCBE&list=RDUtQpSGyPCBE&start_radio=1">
1 Like
#6