html - 将元素定位到右侧

Question

我正在尝试用css3制作这样的东西，但我不知道如何将搜索按钮定位在'结果'div的右侧。不是在标签之后

        <div id="ResultBox" style="margin-right:10px;margin-top:5px; height:90%;">
            <div class="result" style="display:inline;">
                <div style="height:100px; width:150px;">
                    Name:
                    <label>Mojtaba Iranpanah</label><br>
                    Email:
                    <label>00000000</label><br>
                    Phone Numner:
                    <label>00000000</label>
                </div>
                <div class="btn" style="float:right;">
                    <button>Search!</button>
                </div>
            </div>
        </div>

Answer 1

使用它：

<div id="ResultBox" style="margin-right:10px;margin-top:5px; height:90%;">
    <div class="result" style="display:inline;">
        <div style="height:100px; width:150px; display:inline-block; float:left;">
            Name:
            <label>Mojtaba Iranpanah</label><br>
            Email:
            <label>00000000</label><br>
            Phone Numner:
            <label>00000000</label>
        </div>
        <div class="btn" style="float:right;display:inline-block;">
            <button>Search!</button>
        </div>
    </div>
</div>

演示：http://jsfiddle.net/DZPEy/

Answer 2

这可以解决您的问题：

<div id="ResultBox" style="margin-right:10px;margin-top:5px; height:90%;">
    <div class="result" style=""> <!-- display:inline here has no effect -->
        <!-- Here is the place to put the display -->
        <div style="display:inline-block; height:100px; width:150px;">Name:
            <label>Mojtaba Iranpanah</label>
            <br>Email:
            <label>00000000</label>
            <br>Phone Numner:
            <label>00000000</label>
        </div>
        <!-- Here is the place to put the display -->
        <div class="btn" style="display:inline-block; vertical-align: middle; height: 100px;">
            <button>Search!</button>
        </div>
    </div>
</div>

演示：http://jsfiddle.net/t92c2/2/

Answer 3

尝试如下：

<div id="ResultBox" style="margin-right:10px;margin-top:5px; height:90%;">
            <div class="result" style="display:inline;">
                <div style="height:100px; width:150px; float:left">
                    Name:
                    <label>Mojtaba Iranpanah</label><br>
                    Email:
                    <label>00000000</label><br>
                    Phone Numner:
                    <label>00000000</label>
                </div>
                <div class="btn" style="float:left; margin-left:10px">
                    <button>Search!</button>
                </div>
            </div>
        </div>