IE7에서 입력 유형 = "이미지"패딩 문제

다음은 HTML과 CSS입니다. 이것은 IE7을 제외한 모든 브라우저에서 작동합니다. width 및 height은 button.gif의 크기입니다. 다른 모든 브라우저에서는 이미지가 주위에 패딩을 사용하여 입력 필드에 추가되고 (단추가 중간의 이미지와 넓어 지도록), 부모 div의 아래쪽에 수직으로 정렬됩니다. IE7에서는 작동하지 않습니다. IE7에서 입력 필드의 전체 크기는 15px x 15px이며 패딩은 완전히 무시됩니다.IE7에서 입력 유형 = "이미지"패딩 문제

<input class="input-button" type="image" src="../images/button.gif" /> 

.input-button { 
width:15px; 
height:15px; 
background-color:#000; 
border:none; 
cursor:pointer; 
padding:4px 20px 5px; 
vertical-align:bottom; 
}

출처

2013-06-24 user1448031

를 추가 할 onli 필요 줘야 : 당신의 .input 버튼에서 -ms-폭을 추가 귀하의 페이지에 유효한 DOCTYPE이 있습니까? 그렇지 않으면, IE는 quirks 모드로 빠진다. 저는 가짜 테두리'border : 0px solid #FFFFFF; '를 추가 하자고 제안했습니다. 이것이 당신의 문제를 해결할지는 모르지만 언급 할 만하다고 생각했습니다. –

@AndrewGibson 네, 맞습니다. 나는 DOCTYPE을 놓쳤다. 그 점을 지적 해 주셔서 감사합니다. 이제는 잘 작동하는 것 같습니다. DOCTYPE은 HTML5 타입 선언''에 필요 없다고 생각했습니다. 어쨌든 지금 일합니다. 감사! – user1448031

''은 시작 html 태그입니다. 모든 문서에는 여전히 페이지의 첫 번째 줄로 DOCTYPE 선언이 필요합니다. 다행히 분류 됨;) –

-1

ur 코드 앞에 접두사 "-ms-"를 사용하고 다시 작성하십시오. 15 픽셀을 등 모든 문에서도 또는 어떤 적 u는 당신의 사건을 ie.in에 대한 wrking되지 않은 생각이 문을 당신이 할

-ms-padding:4px 20px 5px;

출처

2013-06-24 07:16:36

IE7에서 입력 유형 = "이미지"패딩 문제

답변

관련 문제