php - 侧边栏菜单的位置到顶部

Question

我有一个网页，它包含页面sidebar.php。此菜单垂直显示在网页的左侧。我希望它位于页面顶部并水平显示。我无法识别保留的类它在左侧。我没有发布 css 文件。请帮我把它放在顶部。虽然我的代码很长，但我仍然在这里发布它。我对 css 非常熟悉。

    <aside id="slide-out" class="side-nav white fixed">
                <div class="side-nav-wrapper">
                    <div class="sidebar-profile">
                        <div class="sidebar-profile-image">
                            <img src="../assets/images/profile-image.png" class="circle" alt="">
                        </div>
                        <div class="sidebar-profile-info">
                       
                                <p>Admin</p>

                         
                        </div>
                    </div>
            
                <ul class="sidebar-menu collapsible collapsible-accordion" data-collapsible="accordion">
                    <li class="no-padding"><a class="waves-effect waves-grey" href="dashboard.php"><i class="material-icons">settings_input_svideo</i>Dashboard</a></li>
                    <li class="no-padding">
                        <a class="collapsible-header waves-effect waves-grey"><i class="material-icons">apps</i>Department<i class="nav-drop-icon material-icons">keyboard_arrow_right</i></a>
                        <div class="collapsible-body">
                            <ul>
                                <li><a href="adddepartment.php">Add Department</a></li>
                                <li><a href="managedepartments.php">Manage Department</a></li>
                            </ul>
                        </div>
                    </li>
                    <li class="no-padding">
                        <a class="collapsible-header waves-effect waves-grey"><i class="material-icons">account_box</i>Recommending Officer<i class="nav-drop-icon material-icons">keyboard_arrow_right</i></a>
                        <div class="collapsible-body">
                            <ul>
                                <li><a href="addagm.php">Add Recommending Officer</a></li>
                                <li><a href="manageagm.php">Manage Recommending Officer</a></li>
                            </ul>
                        </div>
                    </li>
                  <!--  <li class="no-padding">
                        <a class="collapsible-header waves-effect waves-grey"><i class="material-icons">desktop_windows</i>Stationary Type<i class="nav-drop-icon material-icons">keyboard_arrow_right</i></a>
                        <div class="collapsible-body">
                            <ul>
                                <li><a href="addstationarytype.php">Add Stationary Type</a></li>
                                <li><a href="managestationarytype.php">Manage Stationary Type</a></li>
                                
                            </ul>
                        </div>
                    </li>-->
                    <li class="no-padding">
                        <a class="collapsible-header waves-effect waves-grey"><i class="material-icons">account_box</i>Employees<i class="nav-drop-icon material-icons">keyboard_arrow_right</i></a>
                        <div class="collapsible-body">
                            <ul>
                                <li><a href="addemployee.php">Add Employee</a></li>
                                <li><a href="manageemployee.php">Manage Employee</a></li>
       
                            </ul>
                        </div>
                    </li>

   <li class="no-padding">
                        <a class="collapsible-header waves-effect waves-grey"><i class="material-icons">desktop_windows</i>Stationary Management<i class="nav-drop-icon material-icons">keyboard_arrow_right</i></a>
                        <div class="collapsible-body">
                            <ul>
                               <li><a href="addstationarystock.php"   target="popup"  onclick="window.open('addstationarystock.php','popup','height=600,width=900 top=15 left=300,location=no,toolbar=no,resizable=no, scrollbars=no'); return false;">Add Stationary Stock</a></li>
                                <li><a href="leaves.php">All Stationary Request </a></li>
                                <li><a href="pending-leavehistory.php">Pending Request </a></li>
                                <li><a href="approvedleave-history.php">Approved Request</a></li>
                                  <li><a href="notapproved-leaves.php">Not Approved Request</a></li>
       
                            </ul>
                        </div>
                    </li>


  <li class="no-padding"><a class="waves-effect waves-grey" href="changepassword.php"><i class="material-icons">settings_input_svideo</i>Chnage Password</a></li>

                        <li class="no-padding">
                                <a class="waves-effect waves-grey" href="logout.php"><i class="material-icons">exit_to_app</i>Sign Out</a>
                            </li>  
                 

                 
              
                </ul>
                   <div class="footer">
                    <p class="copyright"><a href="#">SMS </a>©</p>
                
                </div>
                </div>
            </aside> 

标签： phphtmlcssbootstrap-4