"Like"버튼의 4 픽셀 오프셋

Question

내 사이트의 모든 소셜 미디어 버튼을 정렬하고 싶습니다. LinkedIn, GoogleOne 및 Twitter 버튼은 모두 세로로 정렬되지만 페이스 북의 '좋아요'버튼이 4 픽셀 아래로 점프하는 이유를 알 수 없습니다.

나는 margin-top, 수직 정렬 CSS 등을 조정 해 보았습니다.이 버튼을 다시 움직이는 것은 없었습니다.

Answer 1

나는 동일한 문제가있었습니다. 내 fb와 같은 버튼 코드는 다음과 같습니다.

<div id="fb-root"></div> 
<script>(function(d, s, id) { 
    var js, fjs = d.getElementsByTagName(s)[0]; 
    if (d.getElementById(id)) {return;} 
    js = d.createElement(s); js.id = id; 
    js.src = "//connect.facebook.net/en_US/all.js#xfbml=1"; 
    fjs.parentNode.insertBefore(js, fjs); 
}(document, 'script', 'facebook-jssdk'));</script> 

<div class="fb-like" data-href="mysite.com" data-send="false" data-layout="button_count" data-width="30" data-show-faces="false" data-font="arial"></div> 

유일한 해결책은 수동으로 버튼 몇 픽셀을 오프셋하는 것입니다. 나는 사업부 위의 블록을 동봉, 몇 픽셀 그것을 밀어 :이 사용했습니다

.shareable { 
    height: 20px; 
    display: inline-block; 
} 

.shareable .fb-like { 
    top:-3px; 
} 

Answer 2

와는 다른 브라우저 프리젠 테이션에 전혀 해가 일관되게 작동하는 것 같다 :

.fb-like { line-height: 0; }