Zurb foundation 允许在基础上具有列类的哪些标记
我有使用版本5的网格结构。我使用除div之外的一些元素来处理行或列,例如新的HTML5标记,如nav、header等。这会导致网格布局出现问题吗 我问这个问题是因为有一列似乎不在网格中。i、 e其高度比相邻立柱短:Zurb foundation 允许在基础上具有列类的哪些标记,zurb-foundation,css,responsive-design,Zurb Foundation,Css,Responsive Design,我有使用版本5的网格结构。我使用除div之外的一些元素来处理行或列,例如新的HTML5标记,如nav、header等。这会导致网格布局出现问题吗 我问这个问题是因为有一列似乎不在网格中。i、 e其高度比相邻立柱短: <header id="header" class="row"> <div id="logo" class="small-4 large-4 columns"> <div id="site-logo"><a hre
<header id="header" class="row">
<div id="logo" class="small-4 large-4 columns">
<div id="site-logo"><a href="/4test/drupal-7.28/" title="Home">
<img src="http://localhost/4test/drupal-7.28/sites/default/files/ari_0.png" alt="Home">
</a></div>
<a href="/4test/drupal-7.28/" title="Home"><span>Drupal Test</span></a>
</div>
<nav id="navigation" role="navigation" class="small-8 large-8 columns">
<div id="main-menu" class="row">
<div class="small-12 large-12 columns">
<ul class="sub-nav"><li class="first leaf active"><a href="/4test/drupal-7.28/" title="" class="active">Home</a></li>
<li class="leaf"><a href="/4test/drupal-7.28/blog" title="the blog">Blog</a></li>
<li class="last leaf"><a href="/4test/drupal-7.28/node/4">About us</a></li>
</ul> </div></div>
</nav>
</header>
在上述代码中,inspect元件中的导航高度非常短,不能覆盖其相邻列的所有高度
以下屏幕截图演示了这种情况:
按您的预期工作时,列的高度不等于行的高度。它没有设置高度,因此它仅在“子元素”的“高度”处 如果想要相同的高度,则必须设置最小高度
<div id="logo" class="small-4 large-4 columns">
与第二列一样,上面的div将具有子元素的高度