html - 一行中的两个输入字段

标签 html css twitter-bootstrap twitter-bootstrap-3 opencart2.x

我正在尝试使用 Twitter Bootstrap 在同一行显示两个注册字段。

<div class="form-group required">
    <label class="col-sm-2 control-label" for="input-firstname"><?php echo $entry_firstname; ?></label>
    <div class="col-sm-10">
        <input type="text" name="firstname" value="<?php echo $firstname; ?>" placeholder="<?php echo $entry_firstname; ?>" id="input-firstname" class="form-control" />
        <?php if ($error_firstname) { ?>
            <div class="text-danger"><?php echo $error_firstname; ?></div>
        <?php } ?>
    </div>
</div>
<div class="form-group required">
    <label class="col-sm-2 control-label" for="input-lastname"><?php echo $entry_lastname; ?></label>
    <div class="col-sm-10">
        <input type="text" name="lastname" value="<?php echo $lastname; ?>" placeholder="<?php echo $entry_lastname; ?>" id="input-lastname" class="form-control" />
        <?php if ($error_lastname) { ?>
            <div class="text-danger"><?php echo $error_lastname; ?></div>
        <?php } ?>
    </div>
</div>

我该怎么做?

最佳答案

在 bootstrap 中,您可以交替嵌套列和行,应该这样做:

<div class="row">
    <div class="col-xs-12 col-sm-6">
        <div class="form-group required">
            <label class="col-xs-12 col-sm-2 control-label" for="input-firstname"><?php echo $entry_firstname; ?></label>
            <div class="col-xs-12 col-sm-10">
                <input type="text" name="firstname" value="<?php echo $firstname; ?>" placeholder="<?php echo $entry_firstname; ?>" id="input-firstname" class="form-control" />
                <?php if ($error_firstname) { ?>
                    <div class="text-danger"><?php echo $error_firstname; ?></div>
                <?php } ?>
            </div>
        </div>
    </div>
    <div class="col-xs-12 col-sm-6">
        <div class="form-group required">
            <label class="col-xs-12 col-sm-2 control-label" for="input-lastname"><?php echo $entry_lastname; ?></label>
            <div class="col-xs-12 col-sm-10">
                <input type="text" name="lastname" value="<?php echo $lastname; ?>" placeholder="<?php echo $entry_lastname; ?>" id="input-lastname" class="form-control" />
                <?php if ($error_lastname) { ?>
                    <div class="text-danger"><?php echo $error_lastname; ?></div>
                <?php } ?>
            </div>
        </div>
    </div>
</div>

关于html - 一行中的两个输入字段,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38770184/

相关文章:

java - 检查 Selenium Webdriver (Java) 中的 Bootstrap 下拉列表值

html - 在不使用大标签 N 次的情况下在 html 中使文本变大

java - Wicket 6 NonCachingImage 未在 HTML 中显示

html - 屏幕尺寸较小时列重叠

html - 当鼠标悬停在按钮上时,下拉菜单不显示

jquery - 带有 jQ​​uery 水平滚动条的 CSS3 多列布局不能在列之间使用滚轮

javascript - 如何自动添加三个 Bootstrap 输入 slider 的总和?

javascript - jQuery 更改函数第一次起作用

javascript - 如何使用javascript将一个图像元素设置为另一个div的背景图像

jquery - 并排添加两个元素,响应式