Css 当元素具有display:table单元格时，将忽略最小宽度和最大宽度

我试图用它来做简单的流体布局，但我发现它有一个很大的缺陷：在具有表格单元格显示的元素上忽略了最小宽度和最大宽度

在下面的示例中，您知道允许我指定#边栏元素可以伸展多远的解决方法吗

XHTML：

<div id="wrapper">

  <div id="main">
  </div>

  <div id="sidebar">
  </div>

</div>

---

如果您只是尝试进行侧栏和主设置，请使用float:left而不是表行和表单元格。然后您可以在id上添加最小宽度。

在每个div中添加另一个包装：

<div id="wrapper">

  <div id="main">
    <div class="inner"></div>
  </div>

  <div id="sidebar">
    <div class="inner"></div>
  </div>

</div>

---

我正在寻找一个网站的响应设计，显示左->右，然后向下，并希望实现自己的最小宽度。做一些研究，我认为这可能回答这个问题

---

谢谢，添加额外的内部div允许我指定最小宽度。但向内部div添加max width并不能阻止#侧边栏变大，下面是一个屏幕截图：如果您需要将

侧边栏

与

主边栏

的高度相同（或相反），则将它们相互浮动是行不通的。这就是为什么首先要做

display:table

和

display:table cell

的原因。

<div id="wrapper">

  <div id="main">
    <div class="inner"></div>
  </div>

  <div id="sidebar">
    <div class="inner"></div>
  </div>

</div>

#sidebar div.inner {
    min-width: 100px;
    max-width: 300px;
}