Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/446.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何使这两个项目直接并排显示在页面上?_Javascript_Jquery_Css_Facebook_Twitter - Fatal编程技术网

Javascript 如何使这两个项目直接并排显示在页面上?

Javascript 如何使这两个项目直接并排显示在页面上?,javascript,jquery,css,facebook,twitter,Javascript,Jquery,Css,Facebook,Twitter,我正试图让我的Facebook时间线和我的Twitter时间线直接显示在我的网站上。我还不知道怎么做。要查看它现在是什么样子,它位于页面底部 我花了很多时间试图找出如何做到这一点,我自己,我只是不能做到这一点。先谢谢你 <div class="fb-page" data-href="https://www.facebook.com/bustersgourmetsauces/" data-tabs="timeline" data-width="500" data-small-header="

我正试图让我的Facebook时间线和我的Twitter时间线直接显示在我的网站上。我还不知道怎么做。要查看它现在是什么样子,它位于页面底部

我花了很多时间试图找出如何做到这一点,我自己,我只是不能做到这一点。先谢谢你

<div class="fb-page" data-href="https://www.facebook.com/bustersgourmetsauces/" data-tabs="timeline" data-width="500" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true">
    <div class="fb-xfbml-parse-ignore">
        <blockquote cite="https://www.facebook.com/bustersgourmetsauces/">
            <a href="https://www.facebook.com/bustersgourmetsauces/">Buster&#039;s Gourmet Sauces</a>
        </blockquote>
    </div>
</div>
<a class="twitter-timeline" href="https://twitter.com/BustersGourmet" data-widget-id="697564074893127680">Tweets by @BustersGourmet</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>

!功能(d、s、id){
var js,fjs=d.getElementsByTagName[0],p=/^http:/.test(d.location)?'http':'https';
如果(!d.getElementById(id)){
js=d.createElement;
js.id=id;
js.src=p+“://platform.twitter.com/widgets.js”;
fjs.parentNode.insertBefore(js,fjs);
}
}(文件,“脚本”、“推特wjs”);

(功能(d、s、id){
var js,fjs=d.getElementsByTagName[0];
if(d.getElementById(id))返回;
js=d.createElement;js.id=id;
js.src=“//connect.facebook.net/en_US/sdk.js#xfml=1&version=v2.5”;
fjs.parentNode.insertBefore(js,fjs);
}(文档“脚本”、“facebook jssdk”);
!功能(d、s、id){
var js,fjs=d.getElementsByTagName[0],p=/^http:/.test(d.location)?'http':'https';
如果(!d.getElementById(id)){
js=d.createElement;
js.id=id;
js.src=p+“://platform.twitter.com/widgets.js”;
fjs.parentNode.insertBefore(js,fjs);
}
}(文件,“脚本”、“推特wjs”);
试试这个css:

.fb_iframe_widget {
float:left;
width:50%;
}
#twitter-widget-0 {
float:left;
width:50%;
}

主要原因是它们彼此不相邻,因为它们太宽,无法放入容器
div

它们都需要能够适应980像素宽度的容器,因此,如果您希望它们并排放置,则它们的最大大小为490px

假设您直接获取了代码,那么应该有一种方法来设置这两个小部件的宽度