# Keep Dropdown Button Size and Position When Clicked

**URL:** <https://forum.bootstrapstudio.io/t/keep-dropdown-button-size-and-position-when-clicked/9653>\
**Category:** General\
**Created:** [November 24, 2022, 12:29am UTC](https://forum.bootstrapstudio.io/t/keep-dropdown-button-size-and-position-when-clicked/9653 "2022-11-24T00:29:14Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![raniaamina](https://forum.bootstrapstudio.io/user_avatar/forum.bootstrapstudio.io/raniaamina/32/1878_2.png) [@raniaamina](https://forum.bootstrapstudio.io/u/raniaamina)\
**Post date:** [November 24, 2022, 12:29am UTC](https://forum.bootstrapstudio.io/t/keep-dropdown-button-size-and-position-when-clicked/9653/1 "2022-11-24T00:29:14Z")

</div>

I just curious, by default dropdown button will expand and aligned to left when clicked. Is there any way to make it fixed with size and position that we set? It’s often break the layout if i use default dropdown from BSS component.

Here is the example;

 ![gambar](https://forum.bootstrapstudio.io/uploads/default/original/2X/2/2ec488e3769cf458723b66dae71ef108b4e71844.png)

after clicked

 ![gambar](https://forum.bootstrapstudio.io/uploads/default/original/2X/1/1e4dfba796b213061241676d054726988a3acd0e.png)

 ![gambar](https://forum.bootstrapstudio.io/uploads/default/original/2X/b/b328c13086399e5056b95ffa4fab2575a6d5179c.png)

Thanks.

---

<div class="post-metadata">

**Author:** ![printninja](https://forum.bootstrapstudio.io/user_avatar/forum.bootstrapstudio.io/printninja/32/481_2.png) [@printninja](https://forum.bootstrapstudio.io/u/printninja)\
**Post date:** [November 24, 2022, 7:45am UTC](https://forum.bootstrapstudio.io/t/keep-dropdown-button-size-and-position-when-clicked/9653/2 "2022-11-24T07:45:55Z")

</div>

Almost impossible to say what you did wrong without seeing your code, but my guess is that you didn’t build this using a Navbar component, and you’ve changed some of the default CSS rules pertaining to widths. For example, in a Navbar, the dropdown button will not inherit its width from the width of the dropdown menu (or the link titles.)

I did a quick recreation using a standard Navbar component. Using the options available through the Options panel, I have no issues with the layout breaking.

 ![image](https://forum.bootstrapstudio.io/uploads/default/original/2X/a/aba816a70a075d832cdd93d28e2c50bf3c31c81a.png)

 ![image](https://forum.bootstrapstudio.io/uploads/default/original/2X/3/3c16609e301747e04b65ee9c846e7d2a80cd1126.png)

 ![image](https://forum.bootstrapstudio.io/uploads/default/original/2X/f/f298268fc08d34664a298ef8d279051c0dca9a4e.png)

---

<div class="post-metadata">

**Author:** ![raniaamina](https://forum.bootstrapstudio.io/user_avatar/forum.bootstrapstudio.io/raniaamina/32/1878_2.png) [@raniaamina](https://forum.bootstrapstudio.io/u/raniaamina)\
**Post date:** [November 25, 2022, 9:50am UTC](https://forum.bootstrapstudio.io/t/keep-dropdown-button-size-and-position-when-clicked/9653/3 "2022-11-25T09:50:21Z")

</div>

ah, my bad. You’re right, it affected from other custom component. Thanks for remindme about it.