html - CSS/HTML 中没有可见宽度的侧边栏

Question

有没有办法在 css/html 中实现以下行为:

请注意，绿色侧边栏不必响应，但我无法为其指定固定宽度

width: XX px;

因为它可以包含更多或更少的元素，所以事先不知道XX。

棕色条必须具有响应性并占据所有剩余宽度。

提前感谢您的任何技巧!我已经尝试过表格，但没有成功，因为我们无法指定一个 div 来将其限制为必要的内容。

Answer 1

使用 Flexbox 可以轻松实现这一点。这是例子: http://codepen.io/anon/pen/JKXXNE

#container {
  display:flex;
}
#sidebar, #content {
  height: 100px;
}
#sidebar {
  background-color: green; 
}
#content {
  background-color: brown;
  flex: 1;
}