web-dev-qa-db-fra.com

Comment définir une largeur différente pour md-grid-tile

J'utilise le nouveau Angular Material . Ce code produit une grille avec deux colonnes:

<md-grid-list cols="2" rowHeight="10">
  <md-grid-tile></md-grid-tile>
  <md-grid-tile></md-grid-tile>
</md-grid-list>

Comment définir 20% de largeur sur les premières colonnes et 80% sur les secondes?

6
Daniel

Essaye ça:

<md-grid-list cols="10" rowHeight="2:1">
  <md-grid-tile colspan='2'>1</md-grid-tile>
  <md-grid-tile colspan='8'>2</md-grid-tile>
</md-grid-list>

vous devez lire cette documentation: https://material.angular.io/components/grid-list/overview

 enter image description here

15
Raed Khalaf

material.angularjs.org. mdGridTile

Les tuiles contiennent le contenu d'un md-grid-list. Ils couvrent une ou plusieurs cellules de la grille verticalement ou horizontalement et utilisent md-grid-tile-{footer,header} pour afficher le contenu secondaire.

 <md-grid-list cols="10" rowHeight="2:1">

   <md-grid-tile colspan='2'>1 </md-grid-tile>

   <md-grid-tile colspan='8'>2 </md-grid-tile>

 </md-grid-list>

md-row-height 

string

Un des

Longueur CSS - Lignes de hauteur fixe (par exemple 8px ou 1rem) {width}:{height} - Rapport largeur/hauteur (par exemple md-row-height = "16: 9") "fit" - La hauteur sera déterminée en subdivisant la hauteur disponible par le nombre de lignes

0
Kondal