0

我正在尝试用 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>
4

3 回答 3

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/

于 2013-09-11T10:11:13.087 回答
1

这应该可以解决您的问题:

<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/

于 2013-09-11T10:12:00.793 回答
0

尝试如下:

<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>
于 2013-09-11T10:11:26.623 回答