jQuery 탭에서 레이아웃 div를 나란히 표시

Question

jQuery 탭에서 서로 옆에 2 개의 div를 배치하는 방법을 알아 내려고 노력했습니다. 일반적으로, 나는 떠 다니기 만한다 : 두 스타일을 모두 div로 남겨두면 상자 밖에서 작업한다. jQuery 탭에서 div를 배치하는 데 필요한 비밀이 있습니까?

내가 바나나를 몰아내는 데 도움이 되었으면 좋겠다. 내가 실험하고있는 코드를 포함 시켰습니다. 많은 감사드립니다.

<div id="tabContainer"> 
    <!-- the tabs --> 
     <div id="tabs"> 
      <ul> 
      <li><a href="#tabs-1">tab1</a></li> 
      <li><a href="#tabs-2">tab2</a></li> 
      <li><a href="#tabs-3">tab3</a></li> 
      <li><a href="#tabs-4">tab4</a></li> 
      </ul> 

      <div id="tabs-1"> 

       <p>Tab1</p> 

      <div id="tabRight">This is right div which I need to place next to tabs-1 div</div> 

      </div> 


      <div id="tabs-2"> 

       <p>Tab2</p> 

      </div> 

      <div id="tabs-3"> 

       <p>Tab3</p> 

      </div> 

      <div id="tabs-4"> 

       <p>Tab4</p> 

      </div> 

     </div> 
</div> 

CSS (최소)

#tabContainer { float: left; padding-bottom: 1px; margin-top:200px;} 
#tabs-1 { float:left; } 
#tabRight { float:left; } 

Answer 1

당신은 float: left

<p>Tab1</p>에 내가 사업부에서 <p>Tab1</p>을 감고에 float: left를 제공하는 것이 좋습니다 것입니다 줄 필요가있다.

Answer 2

# tabs-1 탭에서 두 개의 별도 div를 만들어야합니다.

<div id="tabs-1"> 
    <div class='tabLeft'>Tab Left</div> 
    <div class="tabRight">Tab Right</div> 
</div> 

그리고 그들에게 스타일을 제공 :

.tabRight { float:left; } 
.tabLeft { float:left; }