Раскрывающееся меню Boostrap

Question

У меня проблема.

<li class="nav-item dropdown nav-element">
                    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" role="button"
                        data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        Galeria
                    </a>
                    <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
                        <a class="dropdown-item" href="#">2016</a>
                        <a class="dropdown-item" href="#">2017</a>
                        <a class="dropdown-item" href="#">2018</a>
                    </div>
                </li>

Это дает мне что-то вроде этого:] 1

, когда мне нужно это:

2

Я не могу понять, как сделать эти элементы меньше. Вы можете мне помочь?

С уважением!