Css 引导3/4，容器流体中的容器或无列的行。图解

我需要一个简单的模式，如图中所示：

这是一次尝试：没有成功

如何做到这一点

我需要照片上的东西。没错

在xs模式下，我禁用了很多东西。我的问题是在桌面模式下

<div class="container-fluid" style="background:red">
      <div class="row">
        <div class="d-inline-block" style="background-color:blue">
          <div class="container">
            <nav class="navbar navbar-light" style="background:white">
              <a class="navbar-brand" href="#">Navbar</a>
              <ul class="nav navbar-nav">
                <li class="nav-item active">
                  <a class="nav-link" href="#">Home</a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="#">Features</a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="#">Pricing</a>
                </li>
              </ul>
              <ul class="nav navbar-nav pull-xs-right">
                <li class="nav-item">
                  <a class="nav-link" href="#">Right</a>
                </li>
              </ul>
            </nav>
          </div>
        </div>
        <div class="d-inline-block" style="background-color:yellow; float:right">
          <span class="d-inline-block" style="background:white; padding: 20px">User box</span>
        </div>
      </div>
    </div>

用户框

如果没有grid/colmuns定位，引导开发就没有多大意义。可以为内部元素“用户框”设置固定宽度

试试这个代码

用户框

如果没有grid/colmuns定位，引导开发就没有多大意义。可以为内部元素“用户框”设置固定宽度

试试这个代码

用户框

亲爱的@Yuri Ramos，这不是我需要的。我需要从屏幕左侧（容器流体开始时）到第一列右侧（菜单结束处）的红色。Than列可以是流动的（我也不能对第一列使用“container”类），第二列必须是流动的（而不是col-md-3），因为每页的内容可能会有很大的变化。我不能说col-md-3、2或1是否足够，我也不想要那个框的右边距。现在更清楚了？看看我的照片。我需要的蓝色（有或没有“容器”的能力）只是从左到右的菜单。在容器液体的右边，我需要的只是绿色盒子的空间（当然有小的填充物和边距）。亲爱的@Yuri Ramos，这不是我需要的。我需要从屏幕左侧（容器流体开始时）到第一列右侧（菜单结束处）的红色。Than列可以是流动的（我也不能对第一列使用“container”类），第二列必须是流动的（而不是col-md-3），因为每页的内容可能会有很大的变化。我不能说col-md-3、2或1是否足够，我也不想要那个框的右边距。现在更清楚了？看看我的照片。我需要的蓝色（有或没有“容器”的能力）只是从左到右的菜单。在容器液体的右边，我只需要一个绿色盒子的空间（当然有小的填充物和边距）。