How i change the positions of the anwsers

I have a Quiz-Game and wanna change the positions of the answer. How i can fixed that?

I've tried a few things but unfortunately nothing worked. In order for the correct questions to be displayed, the category WILL be asked before the game and then the game will begin

html
{% for q in questions %}
                {% if q.kategorie == category and q.flaag == True %}
                        {% if questions.has_next %}
                            <br/>
                            <div class="flex-container">
                                <div class="container1">
                                     <div class="position_startButton"><button  type="submit" name="next"  value="{{q.question}}" class="nächstefrage_btn">Nächste Frage!</button></div>
                                    <div class="game_options_top">
                                        <div class="option">
                                            <p><button class="option_btn"  name="next"  value="{{q.op1}}" formaction="{% url 'quiz' %}?page={{ questions.next_page_number  }} "  type="submit">A: <span id="option_span">{{q.op1}}</span></button></p>
                                        </div>
                                        <div class="option">
                                            <p><button class="option_btn"  name="next"  value="{{q.op2}}" formaction="{% url 'quiz' %}?page={{ questions.next_page_number  }} "  type="submit">B: <span id="option_span">{{q.op2}}</span></button></p>
                                        </div>
                                    </div>
                                    <div class="game_question">
                                        <h1 class="display_question">{{q.question}}</h1>
                                    </div>
                                    <div class="game_options_bottom">
                                        <div class="option">
                                            <p><button class="option_btn"  name="next"  value="{{q.op3}}" formaction="{% url 'quiz' %}?page={{ questions.next_page_number  }} "  type="submit">C: <span id="option_span">{{q.op3}}</span></button></p>
                                        </div>
                                        <div class="option">
                                            <p><button class="option_btn"  name="next"  value="{{q.op4}}" formaction="{% url 'quiz' %}?page={{ questions.next_page_number  }} "  type="submit">D: <span id="option_span">{{q.op4}}</span></button></p>
                                        </div>
                                    </div>
                                </div>
                                <div class="menü">
                                        <button class="menü_button"><i class="fa fa-bars" aria-hidden="true"></i><b> Menü</b></button>
                                        <div class="items">
                                            <a href="{% url 'Example_dashboard' %}"> <i class="fa-solid fa-house"></i> Startseite </a>
                                            <a href="{% url 'Example_fragenkatalog' %}"> <i class="fa-solid fa-pen"></i> Fragenkatalog </a>
                                            <a href="{% url 'statistics' %}"> <i class="fa-solid fa-trophy"></i> Statistik </a>
                                            <a href="{% url 'settings' %}"> <i class="fa-solid fa-gear"></i> Einstellungen </a>
                                            <a href="{% url 'logoutUser' %}"> <i class=></i> Log-Out </a>
                                        </div>
                                </div>
                            </div>
                            <div class="buttons">
                                <div class="position_begründung_button">
                                    <button class="begründung_button">Begründung</button>
                                </div>
                                <div class="position_fragemelden_button">
                                    <button class="fragemelden_button">Frage melden</button>
                                </div>
                                <div class="position_quizbeenden_button">
                                    <button class="quizbeenden_button" formaction="{% url 'Example_dashboard' %}">Quiz beenden</button>
                                </div>
                            </div>
                            <div id="footer">
                                <a class="information" href="https://www.google.at/?hl=de.">Impressum |</a>
                                <a class="information" href="https://www.google.at/?hl=de.">Datenschutz |</a>
                                <a class="information" href="https://www.google.at/?hl=de.">Support</a>
                            </div>

views.py
    if first == True and request.POST.get("Kategorie") != "kategorie":

        score = 0
        wrong = 0
        correct = 0
        total = 0
        globalCategory = request.POST.get("Kategorie")
        first= False
        count_of_selected_category = Paginator(QuesModel.objects.filter(kategorie__exact=globalCategory), 1)
        page = request.GET.get("page")
        x = count_of_selected_category.get_page(page)
        global_counter = 1
        questions = x

        globalQuestions = questions
        global_count_of_questions = len(QuesModel.objects.filter(kategorie__exact=globalCategory, flaag__exact=True))

        


        context = {
                'questions': globalQuestions,
                'category': request.POST.get("Kategorie"),


            }

        return render(request, 'quiz.html', context)

Actual is the correct answer in the same place every time and I want the position to change every time

Back to Top