html - CSS显示内联两种形式而不使用 float

Question

在 html/css 中，我只有两种形式，我想使用 float 将其设置为单行作为 inline widthout。你可以看到这个ONLINE DEMO

在下面的代码中，我想将 display:inline 设置为单行作为两个 div。就像这个屏幕截图:

HTML:

<div class='single-page'>
    <div id="verification-panel">
        <form>
            <fieldset>
                <legend>verification code</legend>
                <label>Mobile Number:</label>
                <input type="text" class="inputs" placeholder="EX:">
                <span class="help-block"></span>
                <button type="button" class="btn">Submit</button>
            </fieldset>
        </form>
    </div>
    <div id="activation-panel">
        <form>
            <fieldset>
                <legend>Active Acount</legend>
                <label>Verfication code:</label>
                <input type="text" class="inputs" placeholder="Verficcation code">
                <span class="help-block"></span>
                <button type="button" class="btn">Submit</button>
            </fieldset>
        </form>
    </div>
</div>

Answer 1

使用 display:inline-block;

#verification-panel,#activation-panel{
    display:inline-block;
}