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>
我使用的是默認的基礎，沒有添加任何東西覆蓋，所以我可以」的代碼弄清楚發生了什麼？我錯過了什麼