title: Content not displaying on right side of vertical nav menu with nested sub-menu
body: <p>Regarding bootstrap-4 nav menus, can someone please advise how to fix the nested submenus so the corresponding content - &quot;Link button 1&quot; &quot;Link button 2&quot; etc. - shows up to the right of the submenu instead of below the submenu?</p>
  <pre><code>&lt;div class=&quot;container-fluid&quot;&gt;
                  &lt;div class=&quot;row&quot;&gt;
                      &lt;div class=&quot;col-sm-3&quot;&gt;
                          &lt;div class=&quot;nav flex-column nav-pills&quot; id=&quot;pillnav&quot; role=&quot;tablist&quot; aria-orientation=&quot;vertical&quot;&gt;
                              &lt;a class=&quot;nav-link&quot; id=&quot;pill1tab&quot; data-toggle=&quot;pill&quot; href=&quot;#pill1&quot; role=&quot;tab&quot; aria-controls=&quot;pill1&quot; aria-selected=&quot;true&quot;&gt;Pill 1&lt;/a&gt;
                              &lt;a class=&quot;nav-link&quot; id=&quot;pill2tab&quot; data-toggle=&quot;pill&quot; href=&quot;#pill2&quot; role=&quot;tab&quot; aria-controls=&quot;pill2&quot; aria-selected=&quot;false&quot;&gt;Pill 2&lt;/a&gt;                            
                          &lt;/div&gt;
                      &lt;/div&gt;                  
                      &lt;div class=&quot;col-sm-9&quot;&gt;
                          &lt;div class=&quot;tab-content&quot; id=&quot;pillcontent&quot;&gt;
                              &lt;div class=&quot;tab-pane fade&quot; id=&quot;pill1&quot; role=&quot;tabpanel&quot; aria-labelledby=&quot;pill1tab&quot;&gt;
                                  
                                  &lt;div class=&quot;nav flex-column nav-pills&quot; id=&quot;choice1nav&quot; role=&quot;tablist&quot; aria-orientation=&quot;vertical&quot;&gt;
                                      &lt;a class=&quot;nav-link&quot; id=&quot;choice1-1tab&quot; data-toggle=&quot;pill&quot; href=&quot;#choice1-1&quot; role=&quot;tab&quot; aria-controls=&quot;choice1-1&quot; aria-selected=&quot;true&quot;&gt;Choice 1-1&lt;/a&gt;
                                      &lt;a class=&quot;nav-link&quot; id=&quot;choice1-2tab&quot; data-toggle=&quot;pill&quot; href=&quot;#choice1-2&quot; role=&quot;tab&quot; aria-controls=&quot;choice1-2&quot; aria-selected=&quot;false&quot;&gt;Choice 1-2&lt;/a&gt;    
                                  &lt;/div&gt;
                                  &lt;div class=&quot;tab-content&quot; id=&quot;choice1content&quot;&gt;
                                      &lt;div class=&quot;tab-pane fade&quot; id=&quot;choice1-1&quot; role=&quot;tabpanel&quot; aria-labelledby=&quot;choice1-1tab&quot;&gt;Choice 1-1 content&lt;/div&gt;
                                      &lt;div class=&quot;tab-pane fade&quot; id=&quot;choice1-2&quot; role=&quot;tabpanel&quot; aria-labelledby=&quot;choice1-2tab&quot;&gt;Choice 1-2 content&lt;/div&gt;
                                  &lt;/div&gt;
                                  
                              &lt;/div&gt;
                              &lt;div class=&quot;tab-pane fade&quot; id=&quot;pill2&quot; role=&quot;tabpanel&quot; aria-labelledby=&quot;pill2tab&quot;&gt;                               
                                  
                                  &lt;div class=&quot;nav flex-column nav-pills&quot; id=&quot;choice2nav&quot; role=&quot;tablist&quot; aria-orientation=&quot;vertical&quot;&gt;
                                      &lt;a class=&quot;nav-link&quot; id=&quot;choice2-1tab&quot; data-toggle=&quot;pill&quot; href=&quot;#choice2-1&quot; role=&quot;tab&quot; aria-controls=&quot;choice2-1&quot; aria-selected=&quot;true&quot;&gt;Choice 2-1&lt;/a&gt;
                                      &lt;a class=&quot;nav-link&quot; id=&quot;choice2-2tab&quot; data-toggle=&quot;pill&quot; href=&quot;#choice2-2&quot; role=&quot;tab&quot; aria-controls=&quot;choice2-2&quot; aria-selected=&quot;false&quot;&gt;Choice 2-2&lt;/a&gt;    
                                  &lt;/div&gt;
                                  &lt;div class=&quot;tab-content&quot; id=&quot;choice1content&quot;&gt;
                                      &lt;div class=&quot;tab-pane fade&quot; id=&quot;choice2-1&quot; role=&quot;tabpanel&quot; aria-labelledby=&quot;choice2-1tab&quot;&gt;Choice 2-1 content&lt;/div&gt;
                                      &lt;div class=&quot;tab-pane fade&quot; id=&quot;choice2-2&quot; role=&quot;tabpanel&quot; aria-labelledby=&quot;choice2-2tab&quot;&gt;Choice 2-2 content&lt;/div&gt;
                                  &lt;/div&gt;                              
                                  
                              &lt;/div&gt;                          
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
  </code></pre>