떠 다니는 요소가 바뀌 었습니다

Question

나는 http://war-mobile.h2client.com/corporate-information/our-team/이라는 워드 프레스 페이지를 가지고 있으며 모바일 웹 사이트를 개발 중입니다. 아래쪽으로 가서 switch to our mobile을 클릭하면 이미지와 정보 div가 서로 바뀌 었음을 알 수 있습니다. 원본 사이트의 스타일을 이미지와 부동 div로 복사했지만이 문제가 발생했습니다. 코드 :

이

Infact는, 아바타 클래스에 대한 CSS는 점 골대를 벗어났습니다 :

.bios div { 
font-size: 16px; 
line-height: 20px; 
margin-top: 25px; 
margin-left: 35px; 
float: left; 
display: block; 
} 


.bios avatar { 
display: inline-block; 
float: left; 
width: 130px; 
height: 165px; 
margin-top: 0px !important; 
} 

Answer 1

모바일 버전이 아닌 경우 (추가 기간 있음) 또는 .bios img이어야합니다. 어느 것이 든 img를위한 float을 적절하게 설정합니다.

Answer 2

가 편집 아바타 선택은 모바일 버전의 이미지를 선택하지 않는

.bios img {float: left;} 

추가

.bios .avatar {...} 

따라서 어떤 요소에도 적용되지 않습니다.

Answer 3

빠른 수정이 속성을 추가하는 것입니다 :

.bios img{ 
    float:left; 
} 

을하지만 당신은 더 많은 버튼을뿐만 아니라 수정을 정리해야합니다 .. 당신의 div의가 너무 혼합되는 것을 두려워 ..