CSS 버튼 브라우저 문제 (배경 이미지)

여기에 약간의 문제가 있습니다. 내가 무엇을 하든지, 크롬과 파이어 폭스는이 CSS 코드를 다른 것으로 보입니다. 크롬의 버튼 (Logg 여관)은 조금 벗어난 것처럼 보입니다. 그러나 마진 (음수와 함께)을 사용하면 두 브라우저가 버튼을 페이지의 상단 섹션쪽으로 밀었습니다.CSS 버튼 브라우저 문제 (배경 이미지)

firefox on top, chrome on the bottom

CSS 코드

#top_wrapper #login_form #btn_login { 
     width: 75px; 
     height: 30px; 
     background-image: url('../img/btn/login.png'); 
     border: none; 
    }

내가에만 크롬을 대상으로해야합니까? 또는 무엇을 할 수 있으며, 어떻게 해결할 수 있습니까? 어떤 도움이 될거야!

HTML 코드

<div id="login_form"> 

    <form id="form_login" action="" method="POST"> 

     <input class="form_login" type="text" value="Brukernavn" onfocus="if(this.value == 'Brukernavn')this.value=''" onblur="if(this.value == '')this.value='Brukernavn'" /> 
     <input class="form_login" type="password" value="Passord" onfocus="if(this.value == 'Passord')this.value=''" onblur="if(this.value == '')this.value='Passord'" /> 
     <input id="btn_login" title="Logg inn" type="submit" value="" /> 

    </form> 

    <div id="lost_password_btn"> 
     <img title="Mistet passordet?" src="img/btn/lost_password.png" /> 
    </div> <!-- end lost_password_btn --> 

</div> <!-- end login_form -->

출처

2012-02-09 Dexty

HTML 코드가 추가되었습니다. – Dexty

파란색의 추측. 그러나 투명한 영역이 상단 부분에 남아있는 배경 이미지에 png를 사용하지 않습니까? –

top_wrapper div는 어디에 있습니까? (나는 당신의 HTML에 정의 된 것을 보지 못했다.) – Tim

보도 크롬에서 F12과 공간이 어디에서 오는 결정하기 위해 개발 도구를 사용합니다.

출처

2012-02-09 14:31:20 JoshNaro

나는 행운을 빌어 이미 이것을 해왔다. 버튼이 "양식 영역"외부로 나옴 – Dexty

개발 도구가 여백 또는 패딩을 표시하지 않고 의도하지 않은 공간에 단서를 제공하지 않았습니까? 나는 믿기가 어렵다는 것을 알게된다. – JoshNaro

양식 입력 요소를 떠 다니는 방법으로 문제를 해결했습니다. 이유는 무엇입니까? 어쨌든 고마워.

출처

2012-02-09 14:54:57 Dexty

CSS 버튼 브라우저 문제 (배경 이미지)

답변

관련 문제