Bootstrap 4 DX引导子菜单pop won'；不能正确显示

我用的是dx:BootstrapMenu，除了弹出的子菜单外，一切都正常。它不能正确显示

它是这样显示的

我不想让子菜单像这样弹出

代码示例。所有css都是通过bootstrap和devexpress自动生成的。但是在devexpress演示中，它工作得很好

<div class="navbar-custom">
            <div class="container-fluid">
                
                    <!-- Navigation Menu-->
                   <nav class="navbar navbar-expand-lg">
                    <div class="collapse navbar-collapse menuContainer">
                        <dx:BootstrapMenu runat="server" ShowPopOutImages="true">

                            <SettingsBootstrap NavbarMode="true"></SettingsBootstrap>
                            <Items>
                            <dx:BootstrapMenuItem Text="Home" NavigateUrl="Default.aspx" IconCssClass="dripicons-home" CssClass="main-menu-item">
                              
                            </dx:BootstrapMenuItem>

                            <dx:BootstrapMenuItem Text="Transactions" IconCssClass="dripicons-tags" CssClass="main-menu-item">
                                
                                <Items>
                                    <dx:BootstrapMenuItem Text="Subscriptions / Packs">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text=".NET Windows Forms Components">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="Reporting / Printing Suites">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="VCL Components and Tools">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="ASP.NET Components">
                                    </dx:BootstrapMenuItem>
                                </Items>
                            </dx:BootstrapMenuItem>
                            <dx:BootstrapMenuItem Text="Processes" IconCssClass="dripicons-view-thumb" CssClass="main-menu-item">
                                <Items>
                                    <dx:BootstrapMenuItem Text="Knowledge Base">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="Documentation">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="Support Center">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="Newsgroups">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="Best Practicies">
                                    </dx:BootstrapMenuItem>
                                </Items>
                            </dx:BootstrapMenuItem>

                            <dx:BootstrapMenuItem Text="References" IconCssClass="dripicons-briefcase" CssClass="main-menu-item">
                                <Items>
                                    <dx:BootstrapMenuItem Text="Knowledge Base">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="Documentation">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="Support Center">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="Newsgroups">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="Best Practicies">
                                    </dx:BootstrapMenuItem>
                                </Items>
                            </dx:BootstrapMenuItem>

                            <dx:BootstrapMenuItem Text="Reports" IconCssClass="dripicons-to-do" CssClass="main-menu-item">
                                <Items>
                                    <dx:BootstrapMenuItem Text="Knowledge Base">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="Documentation">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="Support Center">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="Newsgroups">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="Best Practicies">
                                    </dx:BootstrapMenuItem>
                                </Items>
                            </dx:BootstrapMenuItem>

                              <dx:BootstrapMenuItem Text="Tools" IconCssClass="dripicons-gear" CssClass="main-menu-item">
                                <Items>
                                    <dx:BootstrapMenuItem Text="Knowledge Base">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="Documentation">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="Support Center">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="Newsgroups">
                                    </dx:BootstrapMenuItem>
                                    <dx:BootstrapMenuItem Text="Best Practicies">
                                    </dx:BootstrapMenuItem>
                                </Items>
                            </dx:BootstrapMenuItem>
                        </Items>
                    </dx:BootstrapMenu>
                        </div>
                       </nav>
                    <!-- End navigation menu -->
                 <!-- end #navigation -->
            </div> <!-- end container -->
        </div>