Question

我想将两条垂直的按钮排列在一起，如果可能的话，它们之间有一条线。

所以我在类行中创建了一个div元素，其中有三列。

<div class="row">
    <div class="col-md-4">
        <h4>@TextResources.ActiveProcesses</h4>
        @foreach (var process in Model)
        {
            <div class="btn btn-default">@GetString(process.ActionName)</div>
        }
    </div>

    <div class="col-md-1">
    </div>

    <div class="col-md-4">
        <h1>@TextResources.AvailableProcesses</h1>
        @foreach (var process in UnusedProcesses)
        {
            <div class="btn btn-default">@GetString(process.ActionName)</div>
        }
    </div>
</div>

所有按钮确实出现，但彼此相邻。如何将它们垂直分组？

我需要：

按钮|按钮

按钮|

我明白了：

按钮按钮按钮|按钮按钮

Answer 1

为您的按钮提供col-md-12课程：

<div class="row">
    <div class="col-md-4">
        <h4>@TextResources.ActiveProcesses</h4>
        @foreach (var process in Model)
        {
            <div class="col-md-12 btn btn-default">@GetString(process.ActionName)</div>
        }
    </div>

    <div class="col-md-1">
    </div>

    <div class="col-md-4">
        <h1>@TextResources.AvailableProcesses</h1>
        @foreach (var process in UnusedProcesses)
        {
            <div class="col-md-12 btn btn-default">@GetString(process.ActionName)</div>
        }
    </div>
</div>

在HTML

1 个答案: