drop down list goes up - Javascript

Question

Here is the link toward my code: https://jsfiddle.net/zoyf35u9/2/ I'd like to have the "Date" drop down list going down instead of up. I need the other form elements to stay in their place if the dropdown is opened.

<meta charset="UTF-8"> 
<style>

</style>
<form action="/todo/ajouter/" method="post">
    <label for="newtodo">Que dois-je faire ?</label>
    <input type="text" name="newtodo" id="newtodo" autofocus />


    Priorité
    <select name="priorite">
        <option value=5>Très haute</option>
        <option value=4>Haute</option>
        <option value=3>Moyenne</option>
        <option value=2>Basse</option>
        <option value=1>Très basse</option>
    </select>

    Date
    <select  name = "day" onmousedown="if(this.options.length>5){this.size=5;}" onchange="this.blur()"  onblur="this.size=0;">
        <script language="javascript" type="text/javascript"> 
            for(var d=1;d<=31;d++)
            {
                document.write("<option>"+d+"</option>");
            }
        </script>
    </select>

    <input type="submit" name="envoyer" />
</form>

thanks

Answer 1

Make the position of the dropdown fixed :

<form action="/todo/ajouter/" method="post">
    <label for="newtodo">Que dois-je faire ?</label>
    <input type="text" name="newtodo" id="newtodo" size ="10" autofocus />


    Priorité
    <select name="priorite">
        <option value=5>Très haute</option>
        <option value=4>Haute</option>
        <option value=3>Moyenne</option>
        <option value=2>Basse</option>
        <option value=1>Très basse</option>
    </select>

    Date
    <select  name = "day" onmousedown="if(this.options.length>5){this.size=5;}" onchange="this.blur()" id="date-dd"  onblur="this.size=0;">
        <script language="javascript" type="text/javascript"> 
            for(var d=1;d<=31;d++)
            {
                document.write("<option>"+d+"</option>");
            }
        </script>
    </select>

    <input type="submit" name="envoyer" />
</form>

and

#date-dd {
  position: fixed;
}

Fiddle .

Answer 2

Modify css for both dropdown and submit button.

I have added a class to submit button

   <input type="submit" name="envoyer" class = "submitButton"/>

css changes:

#date-dd {
  position: fixed;
}
.submitButton {
  position:relative;
  left : 10%;
}