div中的居中按钮

我似乎无法居中社交媒体按钮。现在全社会共享阶层是空的。我应该如何将它们置于css中？（它的麻烦，提供一个小提琴）div中的居中按钮

的HTML代码

<div class="col span-2-of-2 all-soc-share"> 

      <div class="soc-share"> 
        <!--FB SHARE--> 
        <div class="fb-share-button" data-href="http://example.com" data-layout="button_count"></div> 

      </div> 

      <div class="soc-share"> 

       <!--Twitter SHARE--> 
          <a href="https://twitter.com/share" class="twitter-share-button" data-url="http://example.com" data-text="Dummy text" data-size="large">Tweet</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> 
      </div> 

      <div class="soc-share"> 
        <!--Draugiem SHARE--> 
         <script type="text/javascript" src="//www.draugiem.lv/api/api.js"></script> 
       <div id="draugiemLike"></div> 
       <script type="text/javascript"> 
       var p = { 
       link:"example.com", 
       text:"Dummy text ", 
       popup:true 
       }; 
       new DApi.Like(p).append('draugiemLike'); 
       </script> 

      </div> 
     </div>

的CSS

.soc-share{ 
    float: left; 
    margin-right: 30px; 
}

来源

2015-06-20 TacoCat

如果一个小提琴是一件麻烦事，考虑[可运行的代码片段]（http://blog.stackoverflow.com/2014/09/introducing-可运行的JavaScript-CSS-和HTML的代码段/） – ethorn10

不确定为什么你有浮动在那里。试试这个：

.soc-share{ 
    display: inline-block; 
    margin-right: 30px; 
} 

.all-soc-share{ 
    width: 100%; 
    text-align: center; 
}

而且这里有一个小提琴： https://jsfiddle.net/qaq9r4fs/

来源

2015-06-20 01:24:28 sarme

你能做到这一点的纯CSS通过提供

.theclasstocenter { 
     margin-left:auto; 
}

或者你可以下载引导程序并将这些社交按钮与自定义类 “文本中心“。

来源

2015-06-20 01:18:31 modesitt

div中的居中按钮

回答

相关问题