Ignite UI for Angular 8.2.6 バージョン時点での情報に基づいています。
IgxGrid の列は、パーセントもしくはピクセルによる幅の指定ができます。ただし、これら二つの単位を混在することはできません。列幅を指定する場合、各列はパーセントもしくはピクセルで統一して下さい。
次に、正しい設定と正しくない設定の例を挙げます。
正しい設定・・・全ての列幅が、同じ単位(ピクセル)で統一されている。
<igx-grid primaryKey="ID" [data]="data"> <igx-column field="ID" width="100px"></igx-column> <igx-column field="CompanyName" width="150px"></igx-column> <igx-column field="ContactName" width="150px"></igx-column> </igx-grid>
正しくない設定1・・・ピクセルとパーセントが混在している。
<igx-grid primaryKey="ID" [data]="data"> <igx-column field="ID" width="100px"></igx-column> <igx-column field="CompanyName" width="150px"></igx-column> <igx-column field="ContactName" width="15%"></igx-column> <!-- この列だけパーセント指定になっている! --> </igx-grid>
正しくない設定2・・・1列目と3列目はパーセント指定されているが、2列目の幅が指定されていない。
幅を指定している列と、幅を指定していない列を混在させることもできません。
<igx-grid primaryKey="ID" [data]="data"> <igx-column field="ID" width="10%"></igx-column> <igx-column field="CompanyName"></igx-column> <!-- この列だけ列幅の指定がない! --> <igx-column field="ContactName" width="15%"></igx-column> </igx-grid>