0
153
ViewsHow move a button to the right side of the container in Material design
I'm trying to get a button to move to the right side of the container, I used several forms but I can not get it, somehow the style="float: right;"
Maybe this is not a thing, Material design, I have no experience in front-end developments.
<md-toolbar color="primary">
<span><md-icon>mood</md-icon></span>
<span>Material in Angular 2!</span>
<button md-icon-button style="float: left;" [md-menu-trigger-for]="menu">
<md-icon style="float: left;">more_vert</md-icon>
</button>
</md-toolbar>
<button md-icon-button style="float: right;" [md-menu-trigger-for]="menu">
<md-icon style="float: right;">more_vert</md-icon>
I'd like to move it here. I'm sorry for my bad English. I hope you can understand me.
·
Santiago Trujillo
1 answers
Answer question0
You're missing the class on the text <span> which allows it to fill the space:
.example-fill-remaining-space {
// This fills the remaining space, by using flexbox.
// Every toolbar row uses a flexbox row layout.
flex: 1 1 auto;
}<md-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>
</md-toolbar>
·
Santiago Trujillo
Report
Answer question