在同一行中显示两个小部件

时间:2016-11-09 18:08:35

标签: css wordpress twitter linkedin

我在WordPress页面上有一个Twitter和一个LinkedIn共享小部件。我试图在同一行显示两个小部件但是徒劳无功。

Here is a Screenshot

这是显示小部件的代码。

<a href="https://twitter.com/share" class="twitter-share-button" data-show-count="false">Tweet</a><script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>

<script src="//platform.linkedin.com/in.js" type="text/javascript"> lang: en_US</script>
<script type="IN/Share" data-counter="top"></script>

我尝试将CS​​S类应用于它

.share_icon{
white-space: nowarap;
}

但它仍然没有水平对齐。请帮助。

1 个答案:

答案 0 :(得分:1)

在一个范围内环绕两个小部件。跨度用于内联元素。这是一个小提琴https://jsfiddle.net/wnsg3js0/

<span>
  <a href="https://twitter.com/share" class="twitter-share-button" data-show-count="false">Tweet</a><script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
  <script src="//platform.linkedin.com/in.js" type="text/javascript"> lang: en_US</script><script type="IN/Share" data-counter="top"></script>
</span>

以及指向跨度https://www.tutorialspoint.com/html/html_span_tag.htm

的更多链接