The dropdown menu is coming close to being finished, but I cannot figure out how to put the links into the dropdown menu. Every time I try to copy other examples of dropdown menus, but they all look different in their HTML layout, and they all cause me to lose 4 extra tests, rather than pass the 12th one.
I was a little hasty in my previous reply. You really did mean dropdown menu
For your dropdown you will need some css to style that ul to look like a column of buttons, position them relative to your “Dropdown” button and to then hide your menu until you click (or hover maybe) over that button.
Your time would be well spent reading a short article or tutorial on drop down menus.
I did throw together a quick and dirty example in a fork of your codepen
I will continue to work on it.
I got the menu to finally work like how I want it following your advice and some instructions from w3schools, but now some other tests are broken.
I will continue to experiment.
You now have a malformed opening form tag and there is an improperly nested div that wraps only the opening form tag. Both have been added to your code since the original post. Fix those and you’ll be back to passing 12 / 17
Looking over the test cases I’m thinking you might want to look closely at the example pen for this project. The “dropdown menu” that you are making is different from the
<select> element required by the user stories. If that is the case you haven’t really lost anything - everyone needs to learn how to make a dropdown menu at some point.
I think I see it, but kind of not really? I don’t know if I’m dyslexic in some way or something, but I think I see what you are talking about and am going to try and remedy it.
Click the “tidy html” in the upper right of html editor. That will nest your code better so you can see the situation more clearly.
You have a weird nesting situation like below
<div> <form someweirdtexthere> </div> </form>
<div><!-- opening div --> <form id="survey-form" Survey-Holder> <!-- what's that Survey-Holder doing there? --> <!-- Dropdown menu test begin --> <div class="dropdown"> <button class="dropbtn">Dropdown</button> <ul class="dropdown-content"> <li><a href="#name">Name</a></li> <li><a href="#email">E-Mail</a></li> <li><a href="#number">Number</a></li> </ul> </div> </div><!-- closing div -->
OK, I fixed it. Moving on.
OK now I’m hung up on user story 13. It wants me to create at least two radio buttons but have them all under the same value. I will continue to work on it.