Форма не перемещается вниз с помощью Css

Я пытался применить некоторые CSS для перемещения моей формы вверх или вниз по странице, но я все еще не могу заставить ее двигаться, и я не знаю почему, и я пробовал использовать padding и margins, и я все еще не могу заставить ее работать, и css появляется на странице, но ничто на ней не перемещается, и все они просто остаются прикрепленными к навигационной панели в верхней части экрана. Прилагаю html для страницы и CSS.

Css

.main2{
  top:40px;
  margin-left:70px;
  width: 90%;
  height:75%;
  background-color: #36454F;
  position:fixed;
  padding-top: 100%;
  padding-bottom: 1%;




    }




.contact-form {
  float:right;
  background-color:white;
  margin-right:10px;
  width: 30%;
  margin-top:28px;




   }

Вот html код

<!DOCTYPE html>
 {% extends 'parasites_app/base.html' %}
 {% load static %}









 {% block content_block %}
<link rel="stylesheet" type="text/css" href="{% static 'css/Contact.css' %}" xmlns="http://www.w3.org/1999/html"/>
<div class="main" >

<div class="main2">
    <form id="user_form" class="contact-form" method="POST" action='/Contact/' enctype="multipart/form-data">
            <div class="contact-container">

            <h2>Contact Us</h2>
                {% csrf_token %}



                    Email<input type="text" name="Email" value="" size="30" />
                    <br />
                    Question<input type="text" name="Quesstion" value="" size="50" />
                    <br />
                    <!-- Submit button-->
                    <div>
                        <button type="submit" class="submit-button">Send Request</button>
                    </div>


                </div>
            </form>



</div>
</div>
{% endblock %}

Установите для контактной формы позицию position:absolute. Затем вы можете поместить ее куда угодно в пределах фиксированного контейнера, используя top/right/bottom/left.

Вернуться на верх