2013-05-19 3 views
0

일련의 이미지가 div에 가로로 놓여 있습니다.브라우저 크기가 줄어들 때 첫 번째 이미지 만보기로 유지됩니다.

목표는 브라우저가 작아짐에 따라 이미지도 보이므로 모든 이미지가 표시되고 인라인 상태를 유지한다는 것입니다.

현재 첫 번째 이미지 만 표시되지만 다른 이미지는 표시되지 않습니다. (모든 이미지는 작은 얻을 있지만

다음

가 JSFiddle이다. 당신은 작은 브라우저, 이미지가 작아 질 것입니다 수 있도록 하나를 알 수 있지만, 첫 번째 사람이보기에 남아있을 것입니다

http://jsfiddle.net/KXGUM/, 다른 사람은 당신이 볼 수있는 오른쪽으로 스크롤해야

나는 그들이 모두 함께 축소해야 의미 여전히 볼 수 있도록 그들 모두를 원하는

CSS :..

body{margin: 0 auto;} 
#week-wrap {border: 1px solid #000; height: auto; white-space: nowrap; max-width: 100%; width: auto; } 
img {max-width: 100%; height: auto; display: inline-block; width: auto;} 

답변

1

3 개의 이미지가 있으므로 너비는 부모 컨테이너의 33 % 여야합니다. 33 %로 100 % 변경하면 모두 화면과 한 줄에 표시됩니다.

img {max-width: 33%; height: auto; display: inline-block; width: auto;} 

는 여기를 참조하십시오 : http://jsfiddle.net/KXGUM/1/

관련 문제