1

WordPressをベースにしたインターネットポータルがあります。Facebookの「いいね」ボタンが1つあります（整列-右）が、他の右側のボタン（Twitter、LinkedIn、Google +）に統合しようとすると、左側に移動します。それらすべてを正しく整列させる方法がわかりません。CSSについてあまり知識がないので、助けを求めています。

これが今のやり方です：

これが私が望む方法です：

これは私のsingle_post.phpコードです：

<?php the_content(); ?>
<div class="clear"></div>
<?php wp_reset_query(); ?>
<?php wp_link_pages('before=<p class="pagination">&after=</p>'); ?>
<div id="fb-root"></div>
<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/lt_LT/all.js#xfbml=1";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>  
<div class="fb-like" data-send="false" data-layout="box_count" data-width="700" data-show-faces="false" data-font="lucida grande"></div>    
<div class="clear"></div>
</div>
4

1 に答える 1

6

ねえ、私はあなたがこれをすべきだと思います

socailアイコンでフロートプロパティを定義し、デザインに従ってマージンパディング幅の高さを定義します

Css

.social{
float:right;
    border:solid 1px green;
}
.fb, .twit, .share, .gplus{
float:left;
    width:100px;
    height:100px;
    overflow:hidden;
    border-left:solid 1px red;
}

HTML

<div class="social">
    <div class="fb">FB</div>
    <div class="twit">TWIT</div>
    <div class="share">Share</div>
    <div class="gplus">Gp</div>
</div>

ライブデモhttp://jsfiddle.net/3ELc5/

于 2012-04-27T09:02:19.620 に答える