Question

我正在使用ZF6。我正在使用SASS版本。现在创建了一个新行。它的宽度设置为

max-width: 75rem;

我尝试更改css中的行宽，但它不起作用。我还尝试更改SCSS文件中的变量设置，但它没有工作.. 请告诉我如何解决这个问题。感谢。

Answer 1

如果我理解正确，您正在尝试使用自定义宽度创建自定义行？

要执行此操作，您可以使用自己的课程，并添加grid-row，然后添加自己的max-width。

如果这是你的html：

<div class="custom-row-class">
</div>

然后在你的scss文件中写下

.custom-row-class {
  @include row-width();
  max-width: 75em;
}

请注意，如果您的行位于包含div的另一行内，则无法获得更宽的行，因为您的自定义div的max-width缩小为包含div，并且width: 100%也将缩小以适合包含div。

以下是文档的一些链接。我发现Foundation 5 doc更容易理解这一点。另请查看_grid.scss文件以获取更多信息。

Answer 2

如果您希望row width等于整个视口的宽度，则可以使用：

<div class="row expanded">

如果您使用的是两个 css文件，请检查您提及foundation.css或foundation.min.css和app.css的订单或custom.css。 former应该遵循latter，而不是相反。

如果没有任何结果，您可以尝试：

.row
{
  max-width: 80rem !important;
}