2013-03-31 3 views
0

페이스 북, 트위터, g +1 소셜 미디어 단추를 웹 사이트의 한 줄에 추가 할 수있었습니다. 그러나 같은 행에 VK와 같은 단추를 추가하려고하면 나머지 부분 아래로 이동합니다.소셜 미디어 아이콘을 한 줄에 정렬하는 방법은 무엇입니까?

  1. VK 버튼이 새로운 행으로 바뀌는 동안 CSS를 사용하여 4 개를 모두 정렬하고 모든 버튼을 올바르게 정렬하려고했습니다. 여기에 내가 그 일을 시도하는 방법입니다 : 정렬 않은 기본 HTML <center></center>과 같은 이야기 처음 3 개 버튼을 사용하여 시도

#Social { text-align: center; margin-bottom: 20px;

  1. 에서, VK 버튼을 새 행에 갔다. <div id="vk_like"></div> <script type="text/javascript"> VK.Widgets.Like("vk_like", {type: "button", height: 20}); </script>

    당신이 하나를 밖으로 정렬 도와 수 있기를 바랍니다 : 여기에

는 VK 버튼의 코드입니다. 미리 감사드립니다!

답변

1

#vk_like { display: inline-block; }?

+0

이렇게했습니다! 고마워요! – Abysmall

+0

감사. 스티브의 대답은 정확했고 어쩌면 이벤트가 조금 나아졌습니다. 나는 왜 "왜"하는지 자세히 설명하기에는 너무 게을 렀습니다 :-) – Robert

2

VK 코드가 버튼 요소 인 div 태그로 버튼을 감싸고 있기 때문입니다. 이 문제를 해결하려면 divspan (대체 ID는 동일하게 유지)으로 바꾸거나 해당 ID로 div에 대한 명확성을 찾기 때문에 JavaScript가 작동하지 않는다면 Robert가 제안한대로 수행해야합니다. div로 스타일 지정 블라인드 요소를 인라인 요소처럼 렌더링하도록 브라우저에 지시하는 인라인 블록을 표시합니다.

+0

아, 실제로 div가 아닌 span으로 완벽하게 작동했습니다. 제안과 철저한 설명에 감사드립니다! – Abysmall

관련 문제