我使用的基础3打造一个负责任的网站，但我希望有页脚和导航背景宽度占据整个宽度是多少？ 我有一个名为我行作为
class="row navigation"
class="row footer"
我试图寻找如何解决这一问题，但我没办法了。 我假设它是在foundation.css文件小修复，但它目前是一个有点过于庞大，因为我是新来的吧。
任何poiinters大加赞赏。
Answer 1:
我昨天碰到了同样的问题。 诀窍是，对于全宽跨越块，你只要让他们出去行/列结构，因为行/列始终会应用默认的填充。 保持自己的页脚和头，并使用它们内部的行/列。
<header>
This will span the full width of the page
</header>
<div class="row">
<div class="twelve columns">
This text will flow within all typical padding and margins
</div>
</div>
<footer>
This will span the full width of the page
<div class="row">
<div class="twelve columns">
This text will flow within all typical padding and margins
</div>
</div>
</footer>
Answer 2:
我一直在做的是增加一个自定义类，这样我可以用.row IT连锁和覆盖最大宽度设置。
<div class="row full-width"></div>
.row.full-width {
width: 100%;
max-width: 100%;
}
我把宽度这里也涵盖基地，但它是在foundation.css已经宣布所以你可以忽略它。
Answer 3:
如果您使用Zurb基础框架，只需删除row类和类包装的元素container是100％的宽度。 现在你可能要居中的东西，使用类centered是这样的：
<div class="container navigation">
<div class="centered">
Some navigation stuff
</div>
</div>
Answer 4:
我完全不同意的答案。 你不应该使用！重要
请参考我的文章和演示在http://edcharbeneau.github.com/FoundationSinglePageRWD/
你应该能够让你从那里需要什么。 该演示是2.2，但在功能上V3非常相似。
Answer 5:
使用“节”，如：
<section>
<div class="row">
<div class="small-12 columns">
</div>
</div>
</section>
然后，分配一个ID的部分，并使用你的背景。
Answer 6:
我知道已经有很多答案，但我觉得我有一些新的东西本主题中添加，如果有人用基金会5就这个问题跌跌撞撞（像我一样）。
由于基金是使用REM单位，这将是最好的改变.row使用这些类，并通过添加额外的类，所以你只能有选择的行全角。 例如通过使用.full类：
.row.full {
max-width: 80rem; /* about 90rem should give you almost full screen width */
}
你可以看到，它甚至在Zurb基金会的文档页面中使用这样的（他们改变.row类，虽然）： http://foundation.zurb.com/docs/ （只是看看网页源代码）
Answer 7:
这是关于基金会5.无到目前为止给出的答案，提供边到边，全宽。 这是因为内.columns添加填充。
对于一个真正的边到边，全宽内容，添加到你的CSS。
.row.full { width: 100%; max-width: 100%; }
.row.full>.column:first-child,
.row.full>.columns:first-child { padding-left: 0; }
.row.full>.column:last-child,
.row.full>.columns:last-child { padding-right: 0; }
只需添加.full类将.row您想扩展全宽。
<div class="row full">
<div class="medium-6 column">This column touches Left edge.</div>
<div class="medium-6 column">This column touches Right edge.</div>
</div>
Answer 8:
基金会6支持此功能自然地row expanded 。 代码例如：
<div class="expanded row">
...
</div>
在这里阅读更多： http://foundation.zurb.com/sites/docs/grid.html#fluid-row
Answer 9:
只是覆盖max-width属性作为max-width: initial; ， 例如，
.fullWidth {
width: 100%;
margin-left: auto;
margin-right: auto;
max-width: initial;
}
<div class="row fullWidth"> </div>
这对我的作品:)
Answer 10:
你真的想保留该行类，否则你失去了很多网格系统的力量。 为什么不改变$ rowWidth从1000（默认值）设置为100％。 这可以在文件foundation_and_overrides.scss找到
Answer 11:
只需设置
$row-width: 100%;
http://foundation.zurb.com/forum/posts/927-full-width-layouts
Answer 12:
我不知道如果我失去了一些东西，但我不得不添加一个.row DIV为.centered工作。 我仍然可以风格的.header有在这种情况下，全宽背景，但.container方法并没有为我工作。
<header class="header">
<div class="row">
<div class="centered">
Logo and stuff
</div>
</div>
<div class="row">
Some navigation stuff
</div>
</header>
Answer 13:
如果你不给它的“行”类，并把塔内它可以在一个宽度为100％
Answer 14:
如果您使用顶嘴，这是一个更好的办法：
<div class="row full-width"></div>
.row{
&.full-width{
width: 100%;
max-width: 100%!important; //might be needded depending on your settings
&>.column:first-child,
&>.columns:first-child{
padding-left: 0;
}
&>.column:last-child,
&>.columns:last-child{
padding-right: 0;
}
}
}
Answer 15:
是的，只要使用这样的：
<div class="large-12 columns">
<h2>Header Twelve Columns (this will have full width of the BROWSER <---->></h2>
</div>
文章来源: zurb foundation is it possible to have full row width
