CODEWITHSUNDEEP
angularangular-material
Joe
Joe

Reputation: 2633

Fail to align buttons with angular material

I have a simple task which is to have:

I looked in the angular material website but still something is not sitting right:

<div layout="row" layout-align="start none">
    <button md-raised-button color="primary" (click)="func()" class="md-primary">
      First
    </button>
    <button md-button (click)="func2()">
      Second
    </button>
    <div layout="row" layout-align="end start">
        <button class="md-button" md-button (click)="func3()">
          Third
        </button>
    </div>
</div>

What am I doing wrong?

Upvotes: 1

Views: 1566

Answers (1)

Hamid Samani
Hamid Samani

Reputation: 445

Why you put <div layout="row" layout-align="end start"> ... </div> inside <div layout="row" layout-align="start none"> ? I think putting end start sibling of start none resolve your case.

For example:

<div layout="row" layout-align="start none">

        <button md-raised-button color="primary" (click)="someFunc()" class="md-primary">First</button>
        <button md-button (click)="someFunc2()">Second</button>
</div>
<div layout="row" layout-align="end start">
        <button class="md-button" md-button (click)="someFunc3()">Third</button>
</div>

Upvotes: 1

Related Questions