Saturday, March 19, 2022

[FIXED] Dropdown Button in Yii2

Issue

I have code like this

<?php
use yii\helpers\Url;
use yii\helpers\Html;
use yii\bootstrap\Dropdown;
/* @var $this yii\web\View */

?>
<div class="site-index">

    <div class="jumbotron">
        <h1>Selamat Datang!</h1>
        <p class="lead-lg-5">
            Aplikasi ini ditujukan untuk menampilkan <br>
            data-data dan statistik mahasiswa program Pascasarjana Universitas
        </p>
            <div class="col-md-12 school-options-dropdown text-center">
            <div class="dropdown btn-group"> <div class="btn btn-success btn-sm">
                <a href="#" data-toggle="dropdown" class="dropdown-toggle">Pilih Tahun Periode<b class="caret"></b></a>
                    <?php
                        echo Dropdown::widget([
                        'items' => [
                                    ['label' => 'Periode 2001-2005', 'url' => '#'],
                                    ['label' => 'Periode 2006-2010', 'url' => '#'],
                                    ['label' => 'Periode 2011-2015', 'url' => 'index.php?r=site%2Findexumum'],

                                    ],
                        ]);
                    ?>
            </div>
            </div>
            </div>
    </div>

</div>

The result is like this:

enter image description here

I want to make the list of the button to be in center. What may I do to fix that? Thanks in advance I have made align="center" in

<div class="dropdown btn-group" align="center">

but still not working.


Solution

This is more a bootstrap thing than Yii. It can be solved with a little bit of CSS:

.dropdown {text-align:center;}
.button, .dropdown-menu {margin:10px auto}
.dropdown-menu {width:200px; left:50%; margin-left:-100px;}

Source.



Answered By - gmc

No comments:

Post a Comment

Note: Only a member of this blog may post a comment.