Elemen div HTML mengecut selepas menambah teg borang
P粉041758700
P粉041758700 2023-09-13 19:06:45
0
1
561

Saya menambah teg Borang di luar elemen div tetapi atas sebab tertentu ia mengecut. Saya menggunakan Bootstrap dan saya rasa ia adalah kerana saya telah menetapkan div bekas utama kepada "baris" dan apabila saya menukarnya kepada "col" ia tidak lagi mengecut, tetapi itu bukan susun atur yang saya mahu. Ini kod saya:

<div class="row">
    {{ form()}}
    <div class="col-sm-3 col-md-3 ">
        <!-- small box -->
        <div class="small-box bg-success d-flex flex-column">
            <div class="inner">
                <h3>{{ number_format(status1, 0, '', ',') }}</h3>
                <p>აქტიური</p>
            </div>
            <div class="icon">
                <i class="ion ion-bag"></i>
            </div>
            
            <div class="align-self-center ">
                {{ submit_button("Forward", "name": "1", "class": "btn btn-primary-outline text-white text-sm", 'value':'დაწვრილებით') }}
                {{form.render('id',['value':1])}}
                <i class="fa fa-arrow-circle-right"></i>
            </div>
        </div>
    </div>
    {{ form.render('csrf', ['value': security.getToken()]) }}
    {{ end_form() }}
    <!-- ./col -->
{{ form()}}
<div class="col-sm-3 col-md-3">
        <!-- small box -->
        <div class="small-box bg-info d-flex flex-column">
            <div class="inner">
                <h3>{{ number_format(status0, 0, '', ',') }}</h3>
                <p>პასიური</p>
            </div>
            <div class="icon">
                <i class="ion ion-stats-bars"></i>
            </div>
            <div class="align-self-center">
                {{ submit_button("Forward", "name": "1", "class": "btn btn-primary-outline text-white text-sm", 'value':'დაწვრილებით') }}
                {{form.render('id',['value':0])}}
                <i class="fa fa-arrow-circle-right"></i>
            </div>
           
        </div>
</div>
{{ form.render('csrf', ['value': security.getToken()]) }}
{{ end_form() }}
<div>

Ini reka bentuknya:

Barisan di bawah adalah susun atur yang diingini, inilah yang berlaku sebelum saya menambah markup borang, baris di atas adalah apa yang berlaku apabila saya menambah borang. Apa yang menyebabkan ini? Bagaimanakah saya boleh menyelesaikan masalah ini? terima kasih atas bantuan anda! !

P粉041758700
P粉041758700

membalas semua(1)
P粉821231319

Dari Dokumen:

Anda telah menyisipkan borang antara baris dan lajur, jadi lajur itu kini adalah cucu kepada baris, bukan anak.

Ganti div dengan borang dan bukannya meletakkan borang di dalam div. Pastikan anda menetapkan kelas baris pada borang.

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan