Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Posted by yannverreault
yannverreault
12,599 Points

Footer disappear when I add a dropdown menu in main section.

When I add a dropdown anywhere in the main section of my HTML, the footer just disappear and I dont know why.

</header> <section id="wrapper"> <h1>Welcome!</h1><br /> <label for="hotels">Please select hotel</label><br /> <select id="hotels" name="hotels"> <optgroup label="The strip"> <option value="cosmo">The Cosmopolitan of Las Vegas</option> <option value="mgm">MGM Grand</option> <option value="sls">The SLS Hotel</option> <option value="aria">Aria</option> </section> <footer> <p>This is the footer</p> </footer> </body> </html>

 /*********************************************
HOME
**********************************************/

.wrapper {
    margin: 5px;
}

h1 {
    font-size: 1.5em;
    text-align: center;
}

.wrapper, label, select {
    text-align: center;
    margin-top: 5px;
    margin-left: 15px;
}

.wrapper, label, select, option {
    width: 300px;
    background: transparent;
    color: black;
    height: 35px;
}

 /*********************************************
FOOTER
**********************************************/

footer {
    border-top: 2px solid white;
}```

1 Answer

Max Goetz
Max Goetz
5,360 Points

Hi Yann,

You will want to close off your select tag after the last option in the dropdown list.

<section id="wrapper">
<h1>Welcome!</h1><br />
    <label for="hotels">Please select hotel</label><br />
    <select id="hotels" name="hotels">
        <optgroup label="The strip">
        <option value="cosmo">The Cosmopolitan of Las Vegas</option>
        <option value="mgm">MGM Grand</option>
        <option value="sls">The SLS Hotel</option>
        <option value="aria">Aria</option>
     </select> <!----------Close off select here---------->
</section>
<footer>
<p>This is the footer</p>
</footer>

Hope this helps! :)

Max

yannverreault
yannverreault
12,599 Points

Wow, I can't believe I missed this one. Thank you very much Max!

Max Goetz
Max Goetz
5,360 Points

No problem! Glad I could help! :)