I am trying to add toggle button with button bar (right side) as show in image![enter image description here][1]
I am able to make button bar and I added toggle button from this link http://ionicframework.com/docs/api/directive/ionToggle/
but my toggle button come below the button bar .I need it should come along with button bar as show in image here is my code
<div class="" id="buttonTab" style="border-bottom: 1px solid lightgray">
<div class="button-bar">
</div>
<div>
<ion-toggle ng-model="airplaneMode" toggle-class="toggle-calm">Show Attachment</ion-toggle> </div>
</div>
</div>
The simplest solution is probably to put the button (ion-toggle
element) inside the .button-bar
and float it right.
See it in action here, with position: absolute;
and right: 0;
:
check this . http://plnkr.co/edit/MuMTo8cmNaV2p6W7mFMt?p=preview
your button-bar has width:100% and padding . I made the width 75% and removed the padding and floated it to left and toggle div to right
.button-bar {
/* padding: 1% 18% 1% 18%;*/
float:left;
width:75% !important;
}