时间戳

首页 > 解决方案 > 将 div 的元素向右移动

html - 将 div 的元素向右移动

问题描述

我有一个简单的父 div 元素，其中包含多个子 div 元素。页面加载后，这些 div 元素显示在左侧。我想在右边显示这些项目。我怎样才能做到这一点？

目前，我的页面元素如下所示： 普通的

如果我尝试 style="float:right"，我会得到压缩元素： 压缩

这是html代码：

<div class="row">
    <div class="col-md-2" style="text-wrap:none; width:11%">
        <label>Requests Per Page: </label>
    </div>
    <div class="col-md-1" style="text-wrap:none">
        <select id="RecordsPerPage">
            <option value="10">10</option>
            <option value="25" selected="selected">25</option>
            <option value="50">50</option>
            <option value="100">100</option>
            <option value="150">150</option>
            <option value="200">200</option>
            <option value="250">250</option>
        </select>
    </div>
    <div class="col-md-3" style="text-wrap:none">
        Go to Page #:
        <input type="number" id="UserPageNumber" min="1" size="5" style="width:50px;" value="1" max="87">
        of <span id="spTotalPages">87</span>
        <button id="btnPage" onclick="handlePaging();">GO</button>
    </div>
</div>

标签： htmltwitter-bootstrap

解决方案

将类justify-content-end添加 到行元素

<div class="row align-items-end">

我还建议使用引导实用程序类而不是内联样式。这是您的示例 - 稍作调整：https ://www.bootply.com/k7mrP9fHPz

假设您使用的是当前版本的 Boostrap - v4

推荐阅读