모든 해상도에서 이미지를 세로로 가운데에 맞 춥니 다

모든 일반적인 해상도에서 이미지를 세로로 가운데에 맞출 수 있어야합니다. 많은 사람들이 이미이 질문을 던졌고 그 중 90 %가이 자습서를 제공합니다. http://www.jakpsatweb.cz/css/css-vertical-center-solution.html 모든 해상도에서 이미지를 세로로 가운데에 맞 춥니 다

답변으로 그러나 FF로 내 1280 x 1024 해상도 모니터에서 볼 때, 중앙에 있지 않습니다. 그리고 더 나쁜 것은, 그것은 IE7에서 끔찍하게 부서집니다. 그래서, 그것은 확실히 답이 아닙니다.

나는 불가능한 꿈을 쫓고 있습니까? 이 솔루션은 FF와 IE를 위해 일해야 6/7

솔루션이 작동 할 수있는 모든 작업, 순정 주의자의 약간되고 있지만, 나는 테이블 :

특히 내가 필요 이상 사업부를 선호 할 수있다 이 사이트의 내용입니다. http://www.codecookery.com/test/index.html

본인이 볼 수 있듯이 슬라이드 쇼는 가운데에 맞춰야합니다.

출처

2010-05-05 sarsnake

를 유지합니다 (http://blog.themeforest.net/tutor ials/vertical-centering-with-css /)가 더 좋습니다. –

-1

고정 높이 div가 옵션 인 경우 상위 50 %의 절대 위치를 사용하고 음수 여백을 사용하여 div를 배치 할 수 있습니다. 필자는 FF3.6, IE6, IE8 및 Chrome에서 다음을 테스트했습니다.

<html> 
<head> 
    <style> 
    #vertCenter { 
     height: 400px; 
     position: absolute; 
     top: 50%; 
     margin-top: -200px; 
     border: 1px green solid; 
    } 
    </style> 
</head> 

<body> 
    <div id="vertCenter"> 
     any text<br> 
     any height<br> 
     any content, for example generated from DB<br> 
     everything is vertically centered 
    </div> 
</body> 
</html>

출처

2010-05-06 01:12:34

Hello quirks 모드. – reisio

-1

code here jakpsatweb.cz는보다 덜 무섭다.

출처

2010-05-06 01:15:15 reisio

나는이 해결책이 당신이 찾고있는 것이라고 믿습니다. 나는 그것을 테스트하기 위해 IE에 접근 할 필요가 없다. (그것은 리눅스를 사용하기 위해 얻은 것이다.) 그러나 나는 그것이 작동한다고 확신한다. 테이블 위에있는 div에 관해서라면, 래퍼가 전혀 없습니까?? 뿐만 아니라 이미지가 모니터의 해상도보다 큰 경우 이미지의 크기가 매우 정교 해집니다. 매우 큰 이미지 및/또는 작은 해상도의 경우 가장자리를 따라 약간의 패딩을 원하면 최대 높이와 최대 너비를 조정할 수 있습니다.

CSS의 :

<style> 

/* Positioning */ 
.absoluteCenter { 
margin:auto; /* Required */ 
position:absolute; /* Required */ 
top:0;bottom:0; /* Aligns Vertically - Remove for Horizontal Only */ 
left:0;right:0; /* Aligns Horizontally - Remove for Vertical Only */ 
} 

/* Sizing */ 
.absoluteCenter { /* Fallback */ 
max-height:100%; 
max-width:100%; 
} 

</style>

그리고 HTML :

<img class="absoluteCenter" src="PATHTOIMAGE">

주 :

이미지 나는 [이 기사를] 같은 화면 비율을

출처

2011-06-09 16:17:12 0b10011

ie8에서 DIV로 작업했습니다. – Vinayak

모든 해상도에서 이미지를 세로로 가운데에 맞 춥니 다

답변

관련 문제