같은 크기의 두 div가있는 Div

Question

이미지가있는 div를 다른 div와 같은 줄에 놓으려는 것으로, 다른 div가 서로의 오른쪽에 쌓일 수 있습니다. ?

다음은 내가 달성하고자하는 것으로 만든 이미지입니다. 당신을 감사합니다 http://postimg.org/image/82fg886hb/

<div class="media"> 
     <div style="display:inline"> 
     <img src="images/sample.png" width="92px" height="135px" > 
     <div> 
     <div style="display:inline;" > Points: 1422</div> 
     <div style="display:inline;"> Level: 17</div> 
     <div style="display:inline;"> 
     <img src="images/experienceBar.png" > 
     </div> 
    </div><!-- End div .media --> 

Answer 1

당신은 폭 추가하고

왼쪽 부유한다 예컨대

<style> 
    .cls_my{ 
     float:left; 
     width:300px; 
    } 
</style> 
<div style="display:inline;" class ='cls_my' > Points: 1422</div> 
     <div style="display:inline;" class='cls_my'> Level: 17</div> 

Answer 2

당신은 요소 흐름 변경 플로트를 사용할 수 있습니다.

.media .container { 
 
    overflow: hidden; 
 
} 
 
.media .container img, 
 
.media .container .side { 
 
    float: left; 
 
    margin-right: 10px; 
 
}

<div class="media"> 
 
    <div class="container"> 
 
     <img src="http://placehold.it/100x200" width="92px" height="135px" /> 
 
     <div class="side"> 
 
      <div>Points: 1422</div> 
 
      <div>Level: 17</div> 
 
      <div> 
 
       <img src="http://placehold.it/100x40" /> 
 
      </div> 
 
     </div> 
 
    </div> 
 
</div>

예를 들면 다음과 같습니다