/ / Ktoré značky umožnili mať triedy stĺpcov v nadácii - css, responsive-design, zurb-foundation

Ktoré značky umožnili mať triedy stĺpcov v nadácii - css, responsive-design, zurb-foundation

Mám štruktúru mriežky pomocou verzia 5. Používam niektoré prvky iné než div na spracovanie riadkov alebo stĺpcov, ako sú nové značky HTML5 ako nav, hlavička atď. To spôsobuje problémy s rozložením mriežky?

Pýtam sa na túto otázku, pretože sa zdá, že stĺpec nie je v mriežke. tj jeho výška je kratšia ako u susedných stĺpov:

<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="/images/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>

Vo vyššie uvedenom kóde je výška výšky v inšpekčnom prvku veľmi krátka a nepokrýva všetku výšku susedných stĺpov.

Nasledujúca obrazovka ukazuje situáciu: tu zadajte popis obrázku

odpovede:

1 pre odpoveď č. 1

jeho práca, ako ste očakával, že stĺpec nie je na výške riadku. Nemá nastavenú výšku, takže je len vysoká ako detské prvky.

ak chcete mať rovnakú výšku, musíte nastaviť minimálnu výšku.

  <div id="logo" class="small-4 large-4 columns">

toto dielo vyššie bude mať výšku detských elementov, rovnako ako druhý stĺpec

tu je môj test