Question

如何在同一行显示这两个页面元素？就像现在一样，div使元素显示在两行上。

    <div id="logo-img"><a class="nobk" href="/ai">
<img src="/_/img/logo.gif" alt="Logo"/></a><div class="fb-like" data-send="false" data-width="450" data-show-faces="false">
    </div><div>

Answer 1

div是块类型，除非它是：

，它总是在新行上

浮动float: left
绝对定位postition: absolute
设置为内联类型display: inline

在div.fb-like

上设置其中一些样式

Answer 2

你必须把第一张和第二张图片放在浮动状态。

前：

<div class="clrfx" id="logo-img">
<a class="nobk" href="/ai"><img class="fleft" src="/_/img/logo.gif" alt="Logo"/></a>
<div class="fb-like fleft" data-send="false" data-width="450" data-show-faces="false"></div></div>

<style type="text/css">
.clearfix {display: block;}
.fleft{float:left;}

我不喜欢在这种情况下使用定位，因为使用定位有点棘手。

Answer 3

<style type="text/css">
    #logo-img, .fb-like {
        float:left;
    }
</style>

如何在同一行上打印这两个元素？

3 个答案: