根据PSD划分自举网格系统的问题

Question

对于响应式网站开发，我使用的是twitter bootstrap框架。根据psd容器的总宽度为980px，左块宽度为607px，右块宽度为373px。

如果我使用col-md-8＆amp; col-md-4无法达到以下宽度。有没有什么可以克服它？或者我应该要求设计师根据网格系统（12列）布局进行设计

http://jsfiddle.net/vasanthanvas/h36u8foc/

Answer 1

如果您想为您的网站使用网格，请让设计师使用网格进行设计，因为您将很难使用“半网格”布局。

但我认为你的容器应该是960px而不是980px，因为我们可以将960除以2和3而不是980px。

960布局上的12个cols：12个cols 80px

980布局上的12个cols：12个cols 81.666666667px

Answer 2

你不能使用Bootstrap标准网格。这是所有Grid Framework的限制，基于列布局。

此updated example：

中提供了一种可能的解决方案

我在容器div中添加了一个“自定义网格”类，以便将自定义的效果限制为仅限于此特定区域。

然后，我为这两列添加了以下覆盖规则。使用此％值，差异尊重您所需的结果仅限于1px 。

.custom-grid .left-block
{
    width:62%
}

.custom-grid .right-block
{
    width:38%;
}

相反，如果您想使用Bootstrap标准，您必须让设计师根据列重新设计布局。

无论如何，我建议使用另一个名为PocketGrid的网格系统。我已经在商业解决方案中使用过它，使用％而不是cols，可以让你获得全面的自定义功能。