Bootstrap 4下拉列表不正确和固定位置

Question

问题是bootstrap下拉选择列表远离按钮。位置不正确，没有按钮固定。请查看图片以了解问题。任何人都可以帮助我吗？

这是我的代码：

<div class="button-group dropdown">
            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                Velg lokaler 
                <span class="caret"></span>
            </button>
            <ul class="dropdown-menu px-2" data-bind="foreach: bookable">
                <li>
                    <div class="form-check">
                        <input class="form-check-input" type="checkbox" checked="checked" data-bind="text: name"/>
                        <label class="form-check-label" data-bind="text: name">

                        </label>
                    </div>
                </li>
            </ul>

        </div>