탐색 모음 단추 그룹의 올바르게 정렬되지 않았습니다.

Question

왼쪽에 표시되는 탐색 모음을 만들려고하는데 나머지 콘텐츠는 오른쪽에 있습니다. 문제는 탐색 모음 단추 그룹이 탐색 모음 머리글과 동일한 섹션에 있지 않다는 것입니다. nav-bar 버튼이 왼쪽에있는 navbar-header와 수직으로 정렬되기를 원하지만, 지금은 서로 겹치기를 원합니다. 뿐만 아니라, 버튼 그룹이 navbar-header와 나머지 HTML 컨텐트 사이에 앉아 있거나 겹쳐있는 것처럼 보입니다.

많은 분들께 고맙게 생각합니다. 고맙습니다!

<div class="container-fluid"> 
     <div class="row"> 
     <div class="col-sm-3 col-lg-2"> 
      <nav class="navbar navbar-default navbar-fixed-side"> 
      <div class="container"> 
       <div class="navbar-header"> 
       <a class="navbar-brand" href="./">Lessons</a> 
       </div> 
       <div class="btn-group-vertical navbar-btn"> 
        <div class="btn-group navbar-btn"> 
         <button type="button" class="btn dropdown-toggle" data-toggle="dropdown"> 
          Lesson #1<span class="caret"></span> 
         </button> 
         <ul class="dropdown-menu" role="menu"> 
          <li>Lecture</li> 
          <li>Quiz</li> 
          <li>Exam</li> 
         </ul> 
         <button type="button" class="btn dropdown-toggle" data-toggle="dropdown"> 
          Lesson #2<span class="caret"></span> 
         </button> 
         <ul class="dropdown-menu" role="menu"> 
          <li>Lecture</li> 
          <li>Quiz</li> 
          <li>Exam</li> 
         </ul> 
        </div> 
       </div> 
      </div> 
      </nav> 
     </div> 
     <div class="col-sm-9 col-lg-10"> 
      <div id="lesson"> 
      <h2>Choose a lesson on the left panel to start your study module.</h2> 
      </div> 
     </div> 
     </div> 
    </div> 

Answer 1

먼저 외곽선 CSS가 누락 된 것 같습니다. 적어도 "body"태그가 표시되지 않으므로 코드가 불완전하다고 가정합니다. 참고로 개요 CSS가 있고 포함시키지 않았다면 문제가 될 수 있습니다.

정렬 향해, 당신은 "마진 (- *) : [거리] [단위]"사용할 수 있습니까? 또는 "= 정렬"[센터, 오른쪽, 정당 등] 당신의 CSS는 "