md-列表图标或md按钮对齐右？(角质材料2)
md-列表图标或md按钮对齐右？(角质材料2)
提问于 2017-05-03 13:34:32
如何使按钮/图标/复选框与右侧对齐，如材料1中所示：
https://material.angularjs.org/latest/demo/list
我目前(材料2)有：
<md-list>
<md-list-item *ngFor="let position of cart">
<h3 md-line> {{ position.name }} </h3>
<p md-line>
<span> Line 1 </span>
</p>
<md-icon md-list-icon>delete</md-icon>
</md-list-item>
</md-list>
回答 4
Stack Overflow用户
回答已采纳
发布于 2017-05-03 15:24:29
由于上面描述的解决方案非常简单，只需在选择器中省略mat-list-icon就可以了：
<mat-list>
<mat-list-item *ngFor="let position of cart">
<h3 mat-line> {{ position.name }} </h3>
<p mat-line>
<span> Line 1 </span>
</p>
<div> $2.00 </div>
<button mat-icon-button (click)="remove(1)">
<mat-icon class="mat-24">delete</mat-icon>
</button>
</mat-list-item>
</mat-list>
Stack Overflow用户
发布于 2018-09-17 18:20:18
实际上，垫子列表使用的是挠性盒子。您可以使用CSS属性“order”单独订购该项。只需使用足够大的数字来订购。
md-icon[md-list-icon]{
order: 10;
}<md-list>
<md-list-item *ngFor="let position of cart">
<h3 md-line> {{ position.name }} </h3>
<p md-line>
<span> Line 1 </span>
</p>
<md-icon md-list-icon>delete</md-icon>
</md-list-item>
</md-list>
Stack Overflow用户
发布于 2021-05-04 01:19:50
如果像我这样的人有同样的问题，而建议的解决方案却没有得到解决，那么尝试如下：
.icon-class {
margin-left: auto;
}<mat-list>
<mat-list-item>
{{"Im just a filler"}}
<mat-icon class="icon-class">
fiber_manual_record
</mat-icon>
<mat-divider></mat-divider>
</mat-list-item>
<mat-list>
它对我起了作用，当它对我起作用的时候，我生了自己的气，因为我以前没有弄明白。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/43761644
复制相关文章
相似问题
腾讯云开发者
