Question

我正在试图浮动一个div，里面有几个按钮内嵌一个，但是div被推下来，并显示在

旁边，即使在div中也是如此躲避我这是html：

<div>
    <h1 style="width:50%">Query Results</h1>
    <div id="np-results">
        <button>Prev</button>
        <button>Next</button>
    </div>
</div>

np-results的css：

#np-results{
    float:right;
    width:100px;
    height:auto;
    border-radius: 4px;
    border: solid #4297d7 1px;
    background-color: #fcfdfd;
    margin: 2px;
}

那么我做错了什么不允许div与h1内联？谢谢你的帮助！

Answer 1

问题是默认情况下它们都是显示块。给他们两个display: inline;

的CSS样式

工作演示http://jsfiddle.net/A33nM/

h1 {
    display: inline;
}

#np-results{
    display: inline;
}

或者你可以像Josh Crozier所说的那样，只是将h1漂浮在左边。

http://jsfiddle.net/A33nM/1/

h1 { float: left; }

浮点div与标题内联

1 个答案: