0
我刚刚使用基础中的新柔性盒选项构建了一个网站。除了在移动设备上查看，它的功能非常强大。出于某种原因，例如，即使行是320px，该列也会在iphone 5上延伸至340px。我可以添加溢出：隐藏于行，但我认为这缺少点基础柔性盒网格问题，列太大
继承人
<div class="container">
<!-- HEADER -->
<header class="row align-middle">
<div class="columns logo small-12 js-click-effect-again"><i class="fa fa-fighter-jet" aria-hidden="true"></i></i></div>
<nav class="columns main-nav" role="navigation">
<ul class="row main-nav-list medium-unstack medium-collapse">
<li class="columns"><a href="products.html">Products</a></li>
<li class="columns"><a href="news.html">News</a></li>
<li class="columns"><a href="about.html">About</a></li>
<li class="columns"><a href="contact">Contact</a></li>
</ul>
</nav>
</header>
<main role="main">
<div class="row">
<div class="hero-banner columns">
<img class="hero-image" src="../DIST/images/banner.jpg">
<div class="hero-banner-text">
<h1>Qui autem esse poteris, nisi te amor ipse ceperit?</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cur deinde Metrodori liberos commendas? Sed ea mala virtuti magnitudine obruebantur. Sed mehercule pergrata mihi oratio tua. Et ille ridens: Video, inquit, quid agas; Nam Metrodorum non puto ipsum professum, sed, cum appellaretur ab Epicuro, repudiare tantum beneficium noluisse; Duo Reges: constructio interrete. Qui igitur convenit ab alia voluptate dicere naturam proficisci, in alia summum bonum ponere? Nihil ad rem! Ne sit sane; </p>
<a class="js-overlay-trigger" href="#">Overlay</a>
</div>
</div>
</div>
<div class="medium-unstack row">
<div class="columns tile">
<img src="http://placehold.it/320x150/3B0D0B/fff">
<h2 class="tile-title">
Some title copy
</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ita prorsus, inquam; Minime vero istorum quidem, inquit. Qualem igitur hominem natura inchoavit? Duo Reges: constructio interrete. </p>
<a class="button" href="">A link</a>
</div>
<div class="columns tile">
<img src="http://placehold.it/320x150/E8C0A8/fff">
<h2 class="tile-title">
Some title copy
</h2>
<p>Nihil illinc huc pervenit. Eam stabilem appellas. Bonum patria: miserum exilium. Quae diligentissime contra Aristonem dicuntur a Chryippo. Occultum facinus esse potuerit, gaudebit; Confecta res esset. </p>
<a class="button" href="">A link</a>
</div>
<div class="columns tile">
<img src="http://placehold.it/320x150/63649E/fff">
<h2 class="tile-title">
Some title copy
</h2>
<p>Hoc loco tenere se Triarius non potuit. Igitur ne dolorem quidem. At iam decimum annum in spelunca iacet. Dat enim intervalla et relaxat. Respondeat totidem verbis. Atqui reperies, inquit, in hoc quidem pertinacem; </p>
<a class="button" href="">A link</a>
</div>
</div>
<div class="text-block row">
<div class="columns">
<div class="text-block-content">
<h3>Verba tu fingas et ea dicas, quae non sentias?</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. An ea, quae per vinitorem antea consequebatur, per se ipsa curabit? Si alia sentit, inquam, alia loquitur, numquam intellegam quid sentiat</p>
</div>
</div>
</div>
</main>
<footer class="main-footer row">
<div class="columns">
<div class="row">
<div class="columns">
<div class="footer-group accordion js-accordion">
<h4 class="footer-group-title accordion-trigger js-accordion-trigger">Group title<i class="fa fa-chevron-circle-down" aria-hidden="true"></i></h4>
<ul class="footer-list accordion-content js-accordion-content">
<li><a href="#">A footer link</a></li>
<li><a href="#">A footer link</a></li>
<li><a href="#">A footer link</a></li>
<li><a href="#">A footer link</a></li>
</ul>
</div>
</div>
<div class="columns">
<div class="footer-group accordion js-accordion">
<h4 class="footer-group-title accordion-trigger js-accordion-trigger">Group title<i class="fa fa-chevron-circle-down" aria-hidden="true"></i></h4>
<ul class="footer-list accordion-content js-accordion-content">
<li><a href="#">A footer link</a></li>
<li><a href="#">A footer link</a></li>
<li><a href="#">A footer link</a></li>
<li><a href="#">A footer link</a></li>
</ul>
</div>
</div>
<div class="columns">
<div class="footer-group accordion js-accordion">
<h4 class="footer-group-title accordion-trigger js-accordion-trigger">Group title<i class="fa fa-chevron-circle-down" aria-hidden="true"></i></h4>
<ul class="footer-list accordion-content js-accordion-content">
<li><a href="#">A footer link</a></li>
<li><a href="#">A footer link</a></li>
<li><a href="#">A footer link</a></li>
<li><a href="#">A footer link</a></li>
</ul>
</div>
</div>
<div class="columns">
<div class="footer-group accordion js-accordion">
<h4 class="footer-group-title accordion-trigger js-accordion-trigger">Group title<i class="fa fa-chevron-circle-down" aria-hidden="true"></i></h4>
<ul class="footer-list accordion-content js-accordion-content">
<li><a href="#">A footer link</a></li>
<li><a href="#">A footer link</a></li>
<li><a href="#">A footer link</a></li>
<li><a href="#">A footer link</a></li>
</ul>
</div>
</div>
</div>
<span class="columns copyright align-bottom">©2016</span>
</div>
</footer>
</div>
我使用的是默认的基础，没有添加任何东西覆盖，所以我可以”的代码弄清楚发生了什么？我错过了什么