CSS가있는 HTML5의 가운데 맞춤 버튼

Question

내 웹 사이트에 소셜 미디어 버튼 그룹을 어떻게 배치 할 수 있는지 궁금합니다.

나는 이전에 <center> 태그를 사용했지만 HTML5로 전환 했으므로 CSS의 다른 텍스트 및 이미지의 중심 맞춤 속성을 사용했습니다. 그러나 나는 단추를 구현하기 위해 모두 다른 코딩 스타일을 사용하는 4 가지 소셜 미디어 사이트에 대한 링크가 있습니다. FB - -> <div class="fb-like" data-href="https://www.facebook.com/pages/La-Condesa/242967619184322" data-width="20" data-height="20" data-colorscheme="light" data-layout="standard" data-action="like" data-show-faces="false" data-send="false"></div>

< - 추시 내 코드

---

< 인 인스 타 그램 -> <style>.ig-b- { display: inline-block; } .ig-b- img { visibility: hidden; } .ig-b-:hover { background-position: 0 -60px; } .ig-b-:active { background-position: 0 -120px; } .ig-b-32 { width: 32px; height: 32px; background: url(//badges.instagram.com/static/images/ig-badge-sprite-32.png) no-repeat 0 0; } @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {.ig-b-32 { background-image: url(//badges.instagram.com/static/images/ig-badge-sprite-32@2x.png); background-size: 60px 178px; } }</style><br><br>

<a href="http://instagram.com/lacondesafitzroy?ref=badge" class="ig-b- ig-b-32">img src="//badges.instagram.com/static/images/ig-badge-32.png" alt="Instagram" /></a>

< - 트위터 - > <a href="https://twitter.com/LaaCondesa" class="twitter-follow-button" data-show-count="false" data-show-screen-name="false">Follow @LaaCondesa</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>

< - 텀블러 -><iframe class="btn" frameborder="0" border="0" scrolling="no" allowtransparency="true" height="25" width="114" src="http://platform.tumblr.com/v1/follow_button.html?button_type=2&tumblelog=LaaCondesa&color_scheme=light"></iframe>

---

HTML5의 모든 항목을 중심으로 간결한 방법이 있나요? 아니면 각각을 위해 별도로해야합니까? 그렇다면 어떻게 이들 항목을 센터링 할 수 있습니까?

감사

편집 : 내가 왼쪽으로 죄송합니다 .container { position: static;
height: 700px; width: 780px; top: 50%; left: 50%; margin: 10px;
margin-left: auto; margin-right: auto; }

체크 아웃 www.lacondesa.com.au/test.html이

을보고, 그들은 모두 다음 속성 컨테이너에 포함되어 스타일로 사업부 내부의 버튼을 넣어

Answer 1

시도

text-align:center; 
margin:auto; 

Answer 2

다음 사업부 내에서 특정 폭을주고는 0을 넣어.

div 
{ 
width://your width; 
margin:auto; 
} 

Answer 3

이것은 작동 할 수 있습니다. 시도해보십시오.

margin : 0px auto;