search

jelbourn / material2-app

Simple app that consumes Angular Material 2 components
651 stars 280 forks source link

Alignment of the grid-list's itens [QUESTION] #36

Open brunonmelo opened 7 years ago

brunonmelo commented 7 years ago

For what a saw, all itens inside the grid-tile are aligned on center, I try really hard to change the alignment but I count manage to change. The element that set the alignment is nested deep inside in the grid-list. Is there a way to change this behavior? To set the alignment of the itens in the left or the right of grid-tile?

edemirkan commented 7 years ago

I am using the following ugly work around; Add a class name to the md-grid-tile

<md-grid-tile class="grid-test-1">
</md-grid-tile>

and refer it in the global style.css file for left align ("flex-end" will provide right align)

.grid-test-1 > figure.mat-figure {
  justify-content: flex-start !important;
}
brunonmelo commented 7 years ago

This could definitively do the trick, but, in my opinion, is far from the ideal.

I find out to be more practical to use bootstraps classes and not using the grid functionality, yet, at least for now

I going to wait until it's be a little more mature, but I will leave this as a suggestion of implementation. If we could positioning the itens inside the grid tile using some directive it would give a good power of customization to the developer.

edemirkan commented 7 years ago

Totally agree with your comments, but I think you need to open an issue on angular/material2 as this repo is just for the sample app.

yuriyovych commented 6 years ago

So we do not have a correct approach to align items in grid tiles?