두 div를 나란히 정렬하는 방법은 무엇입니까?

Question

부트 스트랩을 사용하고 있는데 부트 스트랩 컨테이너 안에 두 개의 컨테이너가 있습니다. 이처럼 :

 <div class="container"> 
      <div id="container-map"> 
       aasdasd 
      </div> 
      <div id="container-buttons"> 
       asdasda 
      </div> 
     </div> 

는 내가 뭘하려고 센터는 주요 컨테이너 내부 옆에 두 개의 div가, # 컨테이너지도 및 # 컨테이너 버튼 측면이다.

이 두 div의 내 사용자 정의 CSS입니다 :

#container-map, 
#container-buttons { 
    display: inline-block; 
    margin: 0 auto 0 auto; 
    width: 500px; 
    height: 500px; 
} 

Answer 1

당신이 gridsystem에 내장 된 부트 스트랩을 사용하지 않는 이유가 있습니까? 이 같은?

<div class="container"> 
    <div class="row"> 
     <div class="col-md-3 col-md-offset-3"> 
      <div class="container-map"> 
       asdf 
      </div> 
     </div> 
     <div class="col-md-3"> 
      <div class="container-buttons"> 
        asdf 
       </div> 
     </div> 
    </div> 
</div> 

Answer 2

그냥 둘 용기가 중앙과 측면이 예제의 코드를 시도 할 수 측면

Answer 3

가 될이

#container-map, 
#container-buttons { 
    float: left; 
    margin-left: auto; 
} 

에 CSS를 변경 (div에 대한 .container display:inline-block;에 text-align: center;를 사용하여).

<style> 
.container { 
    position:relative; 
    text-align:center; 
} 
#dv1, #dv2 { 
    display:inline-block; 
    width:100px; 
    margin:0 3px; 
    background:#33f; 
} 
</style> 

<div class="container"> 
    <div id="dv1">Div 1</div> 
    <div id="dv2">Div 2</div> 
</div>