magellan不会坚持基础5电网

Question

我正在运行基金会5和使用magellan，并尝试我可能会一直突破电网。我对此很陌生，任何见解都会有所帮助。当我第一次加载页面时，它正确定位在网格内。当我向下滚动时，magellan菜单跳到左侧并填充整个页面宽度。我再次向上滚动，即使它从浏览器窗口的顶部“自动粘贴”，它也不会改变（意味着它仍然在左边）。我目前只在我的localhost测试服务器上有它。我在firefox和windows上看到了同样的问题。

这里是我的代码：

<div class="row"> 
<div class="large-10" column> 
    <div data-magellan-expedition="fixed"> 
    <dl class="sub-nav"> 
    <dd data-magellan-arrival="arrival"> 
    <a href="#arrival">Arrival</a> 
    </dd> 
    <dd data-magellan-arrival="destination"> 
    <a href="#destination">Destination</a> 
    </dd> 
    </dl> 
    </div> 
</div> 
<div class="large-2" column>nothing</div> 
    <div class="large-10" column> 
    <a name="arrival"></a> 
    <span data-magellan-destination="arrival">Arrival</span> 
    <a name="destination"></a> 
    <span data-magellan-destination="destination">DEstination</span> 
    </div> 
<div class="large-2" column>nothing</div> 
</div> <!--closes div class row--> 

我真的很感激任何见解。这段时间太长了，我一直在让自己疯狂。它必须是可能的 - 在文档页面上，似乎麦哲伦保持正确的网格中间列：http://foundation.zurb.com/docs/components/magellan.html

Answer 1

在文档上已被设置为.fixed类。即使在应用时，您的问题仍然与：Fixed position but relative to container（和Position Fixed width 100%）。

一个可能的修复（或一些东西，可以帮助）将要使用的大电网下面的CSS：

.fixed { 
    background-color:transparent; 
    position: fixed; 
    left: 50%; 
    top: 0%; 
    transform: translateX(calc(-41.66% + 30px)); 
}  
    .fixed .sub-nav { 
     background-color:white; 
     margin-right: calc(41.66% + 30px); 
     padding: 15px; 
    }