我在标准的桌面媒体查询大小的列中简要地解决了这个问题,但它似乎已经自行解决了。既然我正在为宽度减小的媒体查询重置列,那么这个新实现就会出现问题。问题是,当加在一起时,我的两列的总百分比宽度,包括边距(我当前没有使用填充),太大了。
如果重要,我正在使用Susy来取代Twitter Bootstrap(sass版)网格。我删除了几个冗余的Bootstrap文件,包括:_grid.scss,_layouts.scss
我的OSX Firefox Inspector显示以下内容:
#main { width: 65.9575%; }
#local { width: 31.9149%; margin-right: 2.12766%; }
总之,这等于:100.00006 - 打破我的布局。提前致谢!这真是令人头疼的事。
我的scss是:
_variables.scss
===================
// Susy Grids
// -------------------------
$total-columns: 12; // 12
$column-width: 60px; // 60px
$gutter-width: 20px; // 20px
$grid-padding: 0px; // $gutter-width
_responsive.scss
===================
@media (max-width: $breakWidthMaxPhoneLandscape) // 768px
{
.page-template-default
{
#main,
#sub,
#local
{
@include reset-columns;
}
#main
{
@include span-columns(8 omega, $total-columns);
}
#local
{
@include span-columns(4, $total-columns);
@include pull(12);
}
}
}