固定宽度列

Question

我有几栏

<div>

  <div class="col-sm-3 colA">
     Fixed width column for menu
  </div>

  <div class="col-sm-7">
     Data with variable width
  </div>

  <div class="col-sm-1 colC">
     Fixed width column for buttons
  </div>

</div>

我希望第一列和最后一列具有固定宽度。 因此，在大屏幕尺寸时，中间内容将是适应性的，但侧列将始终具有相同的宽度。

@media screen and (min-width: 768px) {
  .colA { width: 200px; }
  .colC { width: 50px; }
}

在小屏幕尺寸中，列将全部为流体并且位于正常的引导模板中。 所以他们到达了屏幕的边界。

只需将宽度放在列值中就行不通了。

这种情况可以解决什么问题？ 我可以尝试另一种观点吗？