Hogyan tudom jobbra tenni a menü elemet?

Hogyan tudom jobbra tenni a menü elemet?
2019-02-16T17:30:07+01:00
2019-02-18T05:56:45+01:00
2022-10-15T21:26:39+02:00
bandymnc
Sziasztok

Angular Materialba bohóckodnék, de nem tudom megoldani, hogy egyes menü elemek bal, mások jobb oldali margóhoz legyenek igazítva, vagyis meg tudtam csinálni, de amikor beleraktam az egészet a toolbar-ba akkor mindegyik bal oldalon jelent meg, és sehogy se tudtam átrakni 

Ez a toolbar csak azért kell, hogy tudjam használni a color tulajdonságot az angular témáknak, nyilván amúgy ki tudnám színezni, de nem a témán keresztül
Mutasd a teljes hozzászólást!
Positioning toolbar contentThe toolbar does not perform any positioning of its content. This gives the user full power to position the content as it suits their application.A common pattern is to position a title on the left with some actions on the right. This can be easily accomplished with display: flex:

<mat-toolbar color="primary"> <span>Application Title</span> <!-- This fills the remaining space of the current row --> <span class="example-fill-remaining-space"></span> <span>Right Aligned Text</span> </mat-toolbar> .example-fill-remaining-space { /* This fills the remaining space, by using flexbox. Every toolbar row uses a flexbox row layout. */ flex: 1 1 auto; }


Mutasd a teljes hozzászólást!

  • Udv. Tudnal esetleg kodot mutatni?
    Mutasd a teljes hozzászólást!
  • Nem lenne egyszerűbb, ha kitennéd az egészet Githubra, és akinek van ideje, majd írogatja neked a kódokat?
    Mutasd a teljes hozzászólást!
  • Te vagy a helyi troll? Ha ennyire idegesítenek a kérdések, akkor kár fórumozni...
    Mutasd a teljes hozzászólást!
  • Kb ennyi az egész, css-ben csak annyi van, hogy float:right, amíg nem raktam be a toolbar-t addig szépen jobbra dobta azt a 2 fajta menüt, ugye az a cél, hogy keres,kínál bal oldalt maradjon a többi jobb oldalon
    <mat-toolbar color="primary"> <mat-toolbar-row> <button mat-button>Keres</button> <button mat-button routerLink="/login">Kínál</button> <div class="right" *ngIf="loggedIn(); else notShow"> <button class="right" mat-button [matMenuTriggerFor]="menu" >{{name}}</button> <mat-menu #menu="matMenu"> <button mat-button>Beállítás</button> <br> <button mat-button>Kijelentkezés</button> </mat-menu> </div> <ng-template #notShow> <button mat-button class="right" routerLink="/login">Bejelentkezés</button> <button mat-button class="right" routerLink="">Regisztráció</button> </ng-template> </mat-toolbar-row> </mat-toolbar> <router-outlet></router-outlet>
    Mutasd a teljes hozzászólást!
  • Mondja mindezt az aki => Angular Materialba bohóckodnék(ik)...
    Megj: Ha nem tudod mi az önkritika, akkor jobb ha meg sem szólalsz, inkább tedd ezt =>
    Mutasd a teljes hozzászólást!
  • Positioning toolbar contentThe toolbar does not perform any positioning of its content. This gives the user full power to position the content as it suits their application.A common pattern is to position a title on the left with some actions on the right. This can be easily accomplished with display: flex:

    <mat-toolbar color="primary"> <span>Application Title</span> <!-- This fills the remaining space of the current row --> <span class="example-fill-remaining-space"></span> <span>Right Aligned Text</span> </mat-toolbar> .example-fill-remaining-space { /* This fills the remaining space, by using flexbox. Every toolbar row uses a flexbox row layout. */ flex: 1 1 auto; }


    Mutasd a teljes hozzászólást!
Tetszett amit olvastál? Szeretnél a jövőben is értesülni a hasonló érdekességekről?
abcd