角度材料設計のレイアウトを整列させる方法はありますかのような行と列は、テーブルのようになりますか?角度材料設計を使用したテーブル状のレイアウト
明確にするために、私が望むのは、以下の表のセルを整列させることです。
もちろん、flex="xxx"
を追加することもできますが、問題は列の幅を修正したくないということです。
私はcss/flexboxソリューションにも興味があります。
<html lang="en" >
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.css">
</head>
<body ng-app="BlankApp" ng-cloak>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-messages.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.js"></script>
<script type="text/javascript">
angular.module('BlankApp', ['ngMaterial']);
</script>
<style>
.myCell {
border: solid black 1px;
padding: 10px;
}
</style>
<div layout="column">
<div layout="row">
<div class="myCell">ROW 1, CELL 1</div>
<div class="myCell">ROW 1, CELL 2</div>
<div class="myCell">ROW 1, CELL 3</div>
</div>
<div layout="row">
<div class="myCell">A LONGER CELL</div>
<div class="myCell">ROW 2, CELL 2</div>
<div class="myCell">ROW 2, CELL 3</div>
</div> </div>
</body>
</html>
汗誰かがすでに1を作成した理由。フォークして再生してから使用することができます。 'https:// github.com/daniel-nagy/md-data-table' – joyBlanks