奇点网格中的固定宽度列？

Question

让我们说我有三个divs：a，b和c，它们共享一个共同的包装div并且我想将它作为三联画对齐。

是否可以让b或c具有固定的宽度（想象一个带有nav的侧边栏），而另外两个是否流畅地扩展？请注意，源顺序很重要（a，b，c顺序）。 max-width（而非固定）也可以正常工作，只要它支持其他两个div的流体扩展。

Answer 1

是的，你可以！看看这个SassMeister showing fixed and fluid columns。

现在，有几点需要注意。首先，您需要固定宽度的排水沟，因为如果不是所有的柱子都是流体的话，您就不能拥有与流体柱成比例的排水沟。其次，您需要使用Singularity Extras的calc输出样式。这意味着您的列将使用CSS3的calc输出，而widely available确实需要对不支持它的浏览器进行回退。除此之外，calc输出样式的工作方式与isolation输出样式完全相同。

去年推出calc输出样式时，我写了一篇名为Bulletproof Combo Fixed and Fluid Grids with CSS Calc的博客文章详细解释了如何使用calc创建固定和流体网格并将其引入Singularity。