使用 Foundation 框架进行行分布

【问题标题】：Row distribution using Foundation framework使用 Foundation 框架进行行分布
【发布时间】：2013-07-16 00:09:33
【问题描述】：

我需要这个发行版，我正在使用 Foundation 框架，我尝试过这个但不起作用。

<div class="row">
       <div class="small-6 large-2 columns">Logo</div>
       <div class="small-12 large-8 columns">menu</div>
       <div class="small-6 large-2 columns">Another logo</div>
    </div>

我怎样才能得到它？

【问题讨论】：

也许您可以使用带有集成徽标的顶部导航栏，该徽标可在小型设备上折叠：foundation.zurb.com/docs/components/top-bar.html
不是导航栏，我需要它就像另一列一样。

标签： html css responsive-design zurb-foundation

【解决方案1】：

假设左边的图片是桌面的，右边的图片是移动的，你需要使用推拉展示类来完成这个：

<div class="row">
   <div class="small-12 large-8 columns push-2">
    <ul class="inline-list">
      <li><a href="">Lorem.</a></li>
      <li><a href="">Nisi.</a></li>
      <li><a href="">Quas?</a></li>
      <li><a href="">Tempora.</a></li>
      <li><a href="">Quaerat!</a></li>
    </ul>
   </div>
   <div class="small-6 large-2 columns pull-8"><img src="http://www.placehold.it/600x600&text=logo1" alt=""></div>
   <div class="small-6 large-2 columns"><img src="http://www.placehold.it/600x600&text=logo2" alt=""></div>
</div>

【讨论】：