-1
유동적 인 레이아웃이 있고 브라우저의 크기가 조정 된 경우에도 브라우저 창의 높이와 너비와 항상 일치하는 div가 있습니다. 따라서 브라우저 창 100 % 너비와 100 % 너비 인 div입니다.유체 DIV 내에서 인라인 이미지를 스케일링하고 가운데 정렬하는 방법은 무엇입니까?
이 div에는 부모의 너비와 높이의 100 %에 맞는 이미지가 있습니다. 이론적으로이 이미지는 전체 화면이됩니다. 현재 브라우저 창을 크게 만들면 이미지 크기가 부모 크기보다 커지고 오른쪽은 & 오른쪽이 잘리지 않게됩니다.
브라우저 창을 확대하면 어떻게 이미지의 모든 가장자리가 잘릴 수 있습니까? 그래서 나는 그 부모 내에서 이미지를 수직으로 중심에 놓고 싶습니다.
모든 이미지/div 너비는 백분율을 사용하여 계산됩니다. http://jsfiddle.net/PfzQ8/4/
편집 :
여기에 기존 코드에 링크의 그 jsfiddle은 단지 코드가 내가 현재 가지고있는 문제의 코드가 아닙니다 그것에 확장하고 싶습니다.
은 내가 재현 할 수있어 생각하지 마십시오 Chrome을 사용하는 jsfiddle의 문제. 또한 사용 가능한 공간의 100 %를 채우기 위해 이미지를 늘리거나 너비 또는 높이의 100 %를 채우기 위해 비례 적으로 배율을 조정 하시겠습니까? – Kyle
이 주제를 검색하려하지 않았습니다 ... 빠른 검색에서 쉽게 발견 할 수있는 여러 가지 솔루션이 있습니다. – charlietfl
@charlietfl 내 문제는 다른 곳에서 유체의 레이아웃이 다른 것으로 생각합니다. 내 컨테이너 및 DIV의 중심에서 약 400 % (예 :)로 이미지를 확장하려고합니다. 그러므로 StackOverflow에서 그 어떤 해결책도 찾을 수없는 것처럼 투표가 다소 가혹하다고 생각합니다. 이 솔루션을 시도해 볼 수 있습니다 수정 여부 : http://css-tricks.com/centering-in-the-unknown/ – egr103