如何将所有内容向左浮动而不创建新行 [英] How to float everything to the left without making a new line

问题描述

我无法在我的首页上使用我的社交按钮将所有内容浮动到左侧。

I'm having trouble to get my social buttons on my home page to float everything to the left.

一旦我有浮动左边的其他内容

Once I have it float left other stuff in the page will be messed.

这是我使用的代码

<div style="position:relative;float:left;margin-right: 10px;">

<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&appId=339021756137381";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<a href="https://twitter.com/share" data-url="<?php the_permalink(); ?>" data-counturl="<?php the_permalink(); ?>" data-text="<?php the_title(); ?>" class="twitter-share-button" data-count="<?php the_permalink(); ?>" data-via="AppleSiam"></a>
<div class="fb-like" data-href="<?php the_permalink(); ?>" data-send="false" data-layout="button_count" data-width="450" data-show-faces="false"></div>
</div>

上面的代码不会对页面中的其他内容造成任何混乱，

The above code will not make any mess to other in the page but the button will be in new line

>

我发现问题，我很快就会接受答案。

I found the problem and I will accept the answer soon

< div class =fb- likedata-href =<？php the_permalink（）;？> data-send =falsedata-layout =button_countdata-width =450data-show-faces =false>< / div>

上面的代码，您可以看到 data-width =450设置太长，无法放在同一行，它必须去另一行取得所有 450px

the above code as you can see data-width="450" were set too long that can't fit in the same line and it has to go to the other line to take all the 450px

推荐答案

换句话说，你想要两个按钮在同一行吗？在这种情况下，你只需要在按钮上或者在它们所在的容器上定义一个宽度，这样就可以并排放置。如果他们有空间坐在彼此身边，那么漂浮他们不会让他们走上一条新的路线。

In other words, you want both buttons on the same line? In that case you just need to define a width on the buttons, or on the container they are inside, that allows them to fit side by side. If they have room to sit beside each other, then floating them will not make them go on a new line.

这篇关于如何将所有内容向左浮动而不创建新行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！