Question

我正在尝试制作响应式应用程序＆＃34;屏幕显示包含material design库的网页。应用程序屏幕需要适合页面，而不再是平板电脑屏幕。我在行元素中嵌套了div，它们使用flexbox并且工作得很好（分配空间并适合包含div）。

<body>

  <nav class="amber darken-4"></nav>

  <div class="container-fluid">
    <div class="row">


      <div class="card large amber lighten-4 col l8 m8 s8 left">
         <div class="card small red accent-3 col m12 user">
         </div><!-- small card user -->
         <div class="card small red accent-3 col m12 cart">
         </div><!-- small card cart -->

      </div><!-- card col 8 -->


      <div class="card large amber lighten-4 col l4 m4 s4 right">


          <div class="card small red accent-3 col m12 promo">
          </div><!-- small card promo -->
          <div class="card small red accent-3 col m12 keypad">
          </div><!-- small card keypad -->


      </div><!-- card col 4 -->


    </div><!-- row -->
  </div><!-- container -->


  <!--Import jQuery before materialize.js-->
  <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
  <script type="text/javascript" src="js/materialize.min.js"></script>

</body>

我想制作＆＃34; row＆＃34;元素（col m8和col m4）展开并填充所有屏幕尺寸的剩余屏幕空间。有没有CSS修复它还是可以用flexbox？

Answer 1

Here is something that might help you.

Live sample HERE

HTML

$client->FetchDIASContact( 'MyVastiauWebApplication' , '100' , 'Client' , '987654321' );

CSS

Future<List<X>>

JS

list = future.get()

Live sample HERE

如何使引导网格列跨越屏幕的整个高度

1 个答案: