html - Pure.CSS 将响应式网格列折叠为按钮，并修复最大可能宽度

Question

使用 Pure.css 和 Pure 的 grids-responsive.css 是否有办法在网格列变得小于某个宽度时将其折叠为按钮？

<div class="pure-g">
    <div class="l-box pure-u-1-3 pure-u-md-1-4 pure-u-lg-1-6">
        <h2>Info area, collapse when screen very narrow, constrain when screen wide</h2>
    </div>
    <div class="l-box pure-u-2-3 pure-u-md-3-4 pure-u-lg-5-6">
        <h2>Main area, greedy</h2>

还有一种方法可以使列（例如上方的左列）响应屏幕宽度，但一旦屏幕非常宽，就限制为固定的最大宽度？